jQuery Mobile開發組件

1、jQuery Mobile自定義屬性

    1.data-role：定義不一樣組件元素及頁面視圖等。如視圖頁面：data-role="page"。

    2.data-title：定義視圖頁面標題。

    3.data-transition：定義視圖切換的動畫效果。

        屬性：

                slide：從右到左切換

                slideup：從下到上切換

                slidedown：從上到下切換

                pop：以彈出框的方式打開

                fade：漸變退色方式切換

                flip：就頁面翻轉飛出，新頁面飛入

    4.data-rel：定義浮動層效果的視圖。

    5.data-theme：定義元素或組件內容的主題樣式風格。

    6.data-icon：在元素內添加一個icon小圖標。

        屬性：

                arrow-l：左箭頭；arrow-r：右箭頭；arrow-u：上箭頭；arrow-d：下箭頭；delete：刪除；

                plus：加號；minus：減號；check：對號；gear：齒輪；refresh：刷新；forward：前進；

                back：返回；grid：網格；star：星星；alert：提示；info：信息；home：主頁；search：查找；

    7.data-iconpos：定義icon小圖標的位置，也能夠指定只有按鈕沒有文字的按鈕。

    8.data-inline：按鈕根據內容自適應其長度。

    9.data-type：分組按鈕按水平或垂直方向排列。

    10.data-add-back-btn：指定視圖頁面自動在頁眉左側添加返回按鈕。

    11.data-back-btn-text：指定視圖頁面建立返回按鈕的文本內容，一般都須要和 data-add-back-btn 一塊兒使用。

    12.data-position：實如今滑動屏幕時工具欄的顯示或隱藏狀態。    

    13.data-fullscreen：指定全屏視圖頁面。

    14.data-navtive-menu：指定下拉選擇功能採用平臺內置的選擇器。

    15.data-placeholder：設置下拉選擇功能的佔位符。

    16.data-inset：實現內嵌列表的功能。

    17.data-split-icon：設置列表右側的圖標。

    18.data-split-theme：設置列表右側圖標的主題樣式風格。

    19.data-filter：開啓列表過濾搜索功能。

2、網格佈局

    css定義：定義前綴名稱：ui-block 後面 + a/b/c/d ,最可能是五列。（同時須要指定外層div的樣式是ui-gird 後面  + a/b/c/d）

    摺疊塊：data-role:collapsible;

    手風琴效果：最外層元素定義data-role="collapsible-set"，每個摺疊區域定義data-role="collapsible"；