這本書使用的 jQuery Mobile 版本是 1.1.0,目前最新版本是 1.3.0。
第一章講的很基本,就直接跳到倒數第二節開始看了。以 data- 起始的 attribute 是 jQuery mobile 魔法的根源,設定好 attribute,大致上就完成了。
第二章就是介紹如何使用了。連結(a) href 寫 #page,jqMobile 會顯示 id="page1"、data-role="page" 的 div tag。若是外部檔案,則會以 ajax load 來載入該頁面,這個地方可以用 Firebug 來觀察。在 data-role="page" 的 tag 加上 data-tile attribute 可以自訂 title。在 a 加上 data-prefetch ,可以預先載入目標頁面,這樣可以提昇頁面切換的速度,當然,花在載入的時間就可能會增加。換頁的效果可以在 a 加上 data-transition 與 data-direction 來設定。
第三章,header/footer/toolbars。header 裡的 a 會自動變為 button,並且依照順序排,一般就是左邊一個,右邊一個,要特別指定放右邊,就是 class="ui-btn-right"。要放 back,可以在目標頁面的 tag 加上 data-add-back-btn="true",要修改文字就用 data-back-btn-text="Return"。另外還有介紹 footer/navbar 的切換技巧。toolbar 篇幅較少,似乎只是為了要避免按鈕被擠壓才需要加上 class="ui-bar"。
- Mar 27 Wed 2013 16:13
JQuery Mobile Web Development Essentials (第1章~第3章)
close
文章標籤
全站熱搜
留言列表
發表留言