jQuery Mobile 教程

1分钟

jQuery Mobile 面板

jQuery Mobile 中的面板会在屏幕的左侧向右侧划出。

通过向指定 id 的 <div> 元素添加 data-role="panel" 属性来创建面板。

在 <div> 中添加 HTML 标记来显示你的面板内容：

<div data-role="panel" id="myPanel">
  <h2>面板标题..</h2>
  <p>文本内容..</p>
</div>

直播支持申请

目录

评价

推荐

1. jQuery Mobile 教程

jQuery Mobile 教程

jQuery Mobile 实例

jQuery Mobile 简介

前置知识

什么是 jQuery Mobile?

为什么使用 jQuery Mobile?

最好的阅读体验

jQuery Mobile 安装

从 CDN 中加载 jQuery Mobile

jQuery Mobile CDN

下载 jQuery Mobile

提示

jQuery Mobile 页面

jQuery Mobile 页面实例

实例解析

在页面中添加 jQuery Mobile

在页面中添加 jQuery Mobile 实例

注意

页面作为对话框使用

页面作为对话框使用实例

jQuery Mobile 过渡

jQuery Mobile 页面切换效果

注意

提示

jQuery Mobile 页面切换效果实例

jQuery Mobile 按钮

在 jQuery Mobile 中创建按钮

<button>

<input>

<a>

导航按钮

导航按钮实例

内联按钮

内联按钮实例

组合按钮

组合按钮实例

后退按钮

后退按钮实例

更多链接按钮实例

jQuery Mobile 按钮图标

添加图标到 jQuery Mobile 按钮

注意

定位图标

图标的位置

只显示图标

移除圆圈

黑色、白色按钮

更多实例

jQuery Mobile 弹窗

jQuery Mobile 弹窗实例1

jQuery Mobile 弹窗实例2

关闭弹窗

定位弹窗

定位弹窗实例

过渡

所有过渡效果实例

弹窗方向小边框

弹窗方向小边框实例

弹窗对话框

弹窗对话框实例

图片弹窗

图片弹窗实例

弹窗背景覆盖

弹窗背景覆盖实例

弹窗背景覆盖实例2

注意

jQuery Mobile 工具栏

头部栏

头部栏实例

头部栏实例2

头部栏实例3

尾部栏

尾部栏实例

尾部栏实例2

尾部栏实例3