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