JQuery Mobile学习笔记.docx

上传人:b****7 文档编号:10307221 上传时间:2023-02-10 格式:DOCX 页数:13 大小:126.70KB
下载 相关 举报
JQuery Mobile学习笔记.docx_第1页
第1页 / 共13页
JQuery Mobile学习笔记.docx_第2页
第2页 / 共13页
JQuery Mobile学习笔记.docx_第3页
第3页 / 共13页
JQuery Mobile学习笔记.docx_第4页
第4页 / 共13页
JQuery Mobile学习笔记.docx_第5页
第5页 / 共13页
点击查看更多>>
下载资源
资源描述

JQuery Mobile学习笔记.docx

《JQuery Mobile学习笔记.docx》由会员分享,可在线阅读,更多相关《JQuery Mobile学习笔记.docx(13页珍藏版)》请在冰豆网上搜索。

JQuery Mobile学习笔记.docx

JQueryMobile学习笔记

JQueryMobile

例子解释:

∙data-role="page"是显示在浏览器中的页面

∙data-role="header"创建页面上方的工具栏(常用于标题和搜索按钮)

∙data-role="content"定义页面的内容,比如文本、图像、表单和按钮,等等

∙data-role="footer"创建页面底部的工具栏

定位页眉和页脚

放置页眉和页脚的方式有三种:

∙Inline-默认。

页眉和页脚与页面内容位于行内。

∙Fixed-页面和页脚会留在页面顶部和底部。

∙Fullscreen-与fixed类似;页面和页脚会留在页面顶部和底部,butalsooverthepagecontent.Itisalsoslightlysee-through

请使用data-position属性来定位页眉和页脚:

Inline定位(默认)

jQueryMobile主题

主题化的页面、内容和页脚

主题化的对话框

实例

GoToTheThemedDialogPage

主题化的按钮

实例

Button

Button

Button

主题化的图标

实例

Plus

jQueryMobile过渡效果

jQueryMobile拥有一系列关于如何从一页过渡到下一页的效果

注释:

如需实现过渡效果,浏览器必须支持CSS33D转换:

滑动到页面二

滑动

以上所有效果同时支持反向动作,例如,如果您希望页面从左向右滑动,而不是从右向左,请使用值为"reverse"的data-direction属性。

在后退按钮上是默认的。

jQueryMobile按钮

在jQueryMobile中创建按钮

jQueryMobile中的按钮可通过三种方法创建:

∙使用

按钮

提示:

jQueryMobile中的按钮会自动获得样式,这增强了他们在移动设备上的交互性和可用性。

我们推荐您使用data-role="button"的元素来创建页面之间的链接,而