挑战30天-自学JQM

2019/8/19 列表视图(listview)
listview可用来显示功能画面或显示唯读资料
10-1 data-role="listview" 宣告可设计列表视图
listview 可使用巢状结构
data-split-icon可自订连结图示(预设为箭头)
data-split-theme可设定连结钮主题
10-2 ul角色设为 data-role=list-divider 可用分割主题显示视图
data-autodividers="true" 可自动建立分组
data-filter="true" 新增搜寻列功能
10-3 加入图示功能
注意:测试时,用IE11会无法显示图示??但firefox正常
img class="ui-li-thumb" listview加入图示
img class="ui-li-icon" listview 显示缩略图
图示教学: https://www.playpcesor.com/2015/03/icon-free-download.html
图示下载: https://findicons.com/
图示下载: https://www.flaticon.com/
图示下载: https://www.easyicon.net/

10-4 唯读列表视图,只用来显示资料
img class="ui-li-thumb" 不加入超连结a href="#page2",就变唯读列表,只用来显示资料
img class="ui-li-icon" 不加入超连结a href="#page2",就变唯读列表,只用来显示资料

10-5 data-inset="true"
可将listview资料用圆角显示,来美观画面

10-6 泡泡计数器
class="ui-li-count" 可让每个项目加入计数器功能

10-7 侧邉补充功能
class="ui-li-aside"
注意:测试后,和泡泡计数器合用,画面效果不佳

10-8 listview方法与事件
获取listview子页面:
var s = $('.selector').listview('childPages');
重新整理listview:
当用javascript新增一个listview,要呼叫refresh来更新外观
$('.selector').listview('refresh');
create事件触发处理:
(".selector").listview({create: function(evt,ui){事件处理...}});
输入搜寻文字就会触发:
(".selector").on("listviewbeforefilter", function(evt,data){ 事件处理..});

2019/8/12 设计按钮(button)
9-1 页首或页脚新增按钮
9-2 内容区宣告按钮(和页首及页脚区不同)
9-3 navbar设计
data-role="navbar" 定义navbar
class="ui-btn-active" 定义预设按钮
class="ui-state-persist" 浏览回传保持原有状态
navbar 一行最多五个按钮,超过会变两行
navbar 最好不要超过3个按钮
navbar 搭配data-postition="fixed",就可固定导览列
9-4 用初始化方法新增按钮
$.mobile.page.prototype.options.addBackBtn = "true"; #新增返回按钮
$.mobile.page.prototype.options.backBtnText = "返回"; #按钮文字
$.mobile.page.prototype.options.backBtnTheme = "a"; #按钮主题

2019/8/8 自定义布景主题
8-3 http://jquerymobile.com/themeroller/ 下载自定义布景主题
8-8 按钮式布局

2019/8/5 jQueryMobile布局

7-3 使用CDN方式,在用以下三行,引入jqueryMobile功能

7-4 第一支JQM程式,页面要素
page->head/content/footer

7-12 页面的转场效果 data-transition
fade/pop/flip/turn/flow/slide/slidefade/slideup/slidedown/none
7-15 固定页首与页尾 data-position="fixed"
7-15 全萤幕显示 data-fullscreen="true"
7-16 每个分页加入title data-title="Page Title"

2019/8/2 前端Web设计
5-2 HTML5架构
5-3 javaScript写法
5-4 CSS写法
5-5 桌机页面与手机页面操作差异
CH6 设计RWD式网页-可同时适用手机及桌机
6-1 RWD设计三要素:A.CSS可取得装置萤幕宽度 B.可塑性的网格 C.网页内元件宽度自动调整
6-5 手机和桌机差异: A.手机没有视窗,也无法调整栏宽 B.手机流灠器可用点击或手势,来缩放大小
6-8 设定页面缩放比例
6-8 横屏及直屏布局
6-13 手机viewport设定
A.手机常用,根据手机尺吋自动调整

B.画面显示按照原比例,不允许使用者缩放

C.固定显示画面宽度为320,且最大比例为1倍

2019/7/31 第四章-PHP函数

P4-2 var_dump VS print_r
P4-7 强制转换型别 settype($foo, "integer")
P4-11 isset unset
p4-12 内建数学函数
P4-15 内建字串函数
P4-20 内建日期函数
P4-22 操作日期
P4-30 阵列操作
P4-39 阵列排序
P4-43 自行订义函数
P4-48 变数週期(全域/静态/区域)
P4-52 引用函数(include/require)
P4-55 include也可透过return回传值

2019/7/27
学到第二章-PHP基础

2019/7
因测试程式语言,需要两个咚咚
1.DDNS
2.免费网路空间,需支援HTML+PHP+Mysql

免费网路空间:
参考以下网址
https://www.minwt.com/website/server/14968.html
空间到下面网址申请
https://byet.host/free-hosting


关于作者: 网站小编

码农网专注IT技术教程资源分享平台,学习资源下载网站,58码农网包含计算机技术、网站程序源码下载、编程技术论坛、互联网资源下载等产品服务,提供原创、优质、完整内容的专业码农交流分享平台。

热门文章