jQuery Mobile 實例

jQuery Mobile 頁面

基礎的移動網頁
多頁面
對話框

例子解釋

jQuery Mobile 過渡

淡入淡出效果
翻頁效果
流效果
彈窗效果
滑動效果
滑動淡出效果
上滑動效果
下滑動效果
翻頁效果
無過渡效果
逆轉效果

例子解釋

jQuery Mobile 按鈕

創建按鈕
行內按鈕
分組按鈕
后退按鈕
帶有和不帶有圓角的按鈕
小型和常規尺寸的按鈕
帶有和不帶有陰影的按鈕

例子解釋

jQuery Mobile 按鈕圖標

向按鈕添加圖標
定位圖標
只顯示圖標

例子解釋

jQuery Mobile 工具欄

創建頁眉和頁腳
在頁眉中添加按鈕
在頁眉中向左側添加按鈕
在頁眉中向右側添加按鈕
帶有按鈕的頁腳
帶有居中對齊按鈕的頁腳
帶有分組按鈕的頁腳
帶有水平分組按鈕的頁腳
行內定位 - 頁眉和頁腳與頁面內容行內定位
固定定位 - 頁眉和頁腳將保留在頁面的頂部和底部
全屏定位 - 頁面和頁腳分班位于頂部和底部，但仍然在頁面內容上

例子解釋

jQuery Mobile 導航欄

創建導航欄
在內容中的導航欄
在頁腳中導航欄
在導航欄中為按鈕添加被選外觀（被按下）
添加被選外觀（被按下）
在導航欄中定位圖標
演示在導航欄中的十個按鈕

例子解釋

jQuery Mobile 可折疊

創建內容可折疊塊
當頁面加載時展開內容
嵌套的可折疊塊
可折疊集合（手風琴）
刪除可折疊塊上的圓角
使可折疊塊更小
改變可折疊塊的圖標
可折疊列表
可折疊表單

例子解釋

jQuery Mobile 網格

兩列布局
三列布局
四列布局
五列布局
自定義網格
列中的多行

例子解釋

jQuery Mobile 列表

創建列表視圖
帶有圓角的列表視圖
列表分隔符
自動分隔符
創建搜索過濾器
改變搜索框中的文本
創建只讀列表
向列表項添加縮略圖
使用標準 HTML 來填充帶有信息的列表
向列表項添加圖標
創建帶有分隔按鈕的列表
增強列表項的功能性
創建計數泡泡
改變列表項的默認鏈接圖標
可折疊列表
創建日歷

例子解釋

jQuery Mobile 表單

文本輸入
文本框
搜索輸入
單選按鈕
復選框
對單選按鈕和復選框進行水平組合
帶有單選按鈕和復選框的域包含器
預選的單選按鈕和復選框
創建選擇菜單
創建帶有分隔符的選擇菜單 (optgroup)
自定義選擇菜單
在選擇菜單中選取多個選項
組合選擇菜單
水平組合選擇菜單
預選一個選項
可折疊表單
創建滑塊控件
突出顯示截至滑塊值的軌道
范圍滑塊（雙重的）
創建切換開關
預選一個切換開關

例子解釋

jQuery Mobile 主題

主題 "a"
主題 "b"
主題 "c"
主題 "d"
主題 "e"
主題化的頁眉、內容和頁腳
主題化的對話框
主題化的按鈕
主題化的圖標
頁眉和頁腳中的主題化按鈕
主題化的導航欄
主題化的可折疊按鈕和內容
主題化的列表
主題化的劃分按鈕
主題化的可折疊列表
主題化的表單
主題化的可折疊表單
定制主題

例子解釋

jQuery Mobile 事件

Tap 事件
Taphold 事件
Swipe 事件
Swipeleft 事件
Swiperight 事件
Scrollstart 事件
Scrollstop 事件
Orientationchange 事件 - 提示方向
Orientationchange 事件 - 為水平和垂直方向設置不同的樣式
Page initialization 事件
Page load 事件
Page transition 事件

例子解釋