jQuery Mobile基础
文章平均质量分 70
berained
这个作者很懒,什么都没留下…
展开
-
jQuery Mobile 页面过渡
可选择页面打开方式的css效果 (即如何从一页过渡到下一页的效果) 使用: data-transition="slide">滑动到页面二 fade:淡入淡出到下一页(所有链接上的默认效果) flip:从后向前翻动到下一页 flow:抛出当前页面,引入下一页 pop:像原创 2014-02-21 14:47:17 · 933 阅读 · 0 评论 -
jQuery Mobile 基础事件
1. 页面初始化事件:pageinit$(document).on("pageinit", "#pageId", function () {// jQuery事件处理});2. touch事件:用户触摸屏幕时触发tap -用户敲击某个元素时触发 $("p").on("tap", function () {$(this).hide();}); taph原创 2014-03-17 10:34:52 · 752 阅读 · 0 评论 -
jQuery Mobile 简介
jQuery Mobile 定义:是一种为触控优化的web框架,用于创建移动web 应用程序 适用于所有流行的智能手机和平板电脑 使用HTML5、CSS3、JavaScript、AJAX,通过尽可能少的代码来完成对页面的布局原创 2014-02-21 14:12:05 · 1127 阅读 · 2 评论 -
jQuery Mobile 表单-滑块
滑块控件:允许从一定范围内的数字中选取值 max-最大值 min-最小值 step-数字间隔 value-默认值 突出显示滑块值- data-highlight="true" e.g. range原创 2014-02-27 09:53:39 · 1186 阅读 · 0 评论 -
jQuery Mobile 表单选择菜单
选择菜单:创建下拉菜单,表示列表选项,表示列表分组标题 e.g. fieldset data-role="fieldcontain"> 标题 tex原创 2014-02-26 16:48:15 · 1192 阅读 · 0 评论 -
jQuery Mobile 表单输入元素
输入字段:是通过标准的HTML元素编写的 (jQuery Mobile会为它们设置专门针对移动设备的美观易用的样式,同时还可以使用新的HTML5 类型) e.g. 描述 // type="date" | type="email"文本框:多行文本输入(会自动扩大,以适应用户输入的文本行)原创 2014-02-26 10:50:58 · 1348 阅读 · 0 评论 -
jQuery Mobile 表单基础
jQuery Mobile表单:使用CSS来设置HTML表单元素的样式。表单控件包括:文本框,搜索框,单选框,复选框,选择菜单,滑动条,翻转切换开关基本规则: 元素必须设置method,action属性 每个表单元素必须设置唯一的"id"属性。(该 id 在站点的页面中必须是唯一的) 每个表单元素必须有一个标记 labe原创 2014-02-25 17:04:29 · 873 阅读 · 0 评论 -
jQuery Mobile 列表内容
缩略图:可将大于16*16px 的图像,自动调整至80*80px e.g. 添加16*16px的图像: class="ui-li-icon" e.g. <a href="#">image拆分:在内放置两个链接,可创建带垂直分隔栏的拆分列表 对于第二个链接会自动添加蓝色箭头图标,链接原创 2014-02-25 15:38:18 · 842 阅读 · 0 评论 -
jQuery Mobile 折叠
可折叠: 允许隐藏或显示内容 向某容器分配属性 data-role="collapsible" 表示折叠块 加载时显示扩展内容:data-collapsed="false" // 默认加载折叠块时是隐藏折叠内容 e.g. 折叠原创 2014-02-24 16:18:16 · 803 阅读 · 0 评论 -
jQuery Mobile 列表视图
列表视图:是一种标准的HTML列表,分为有序列表(ol>)和无序列表(l>) 创建: data-role="listview" 默认地,列表中的列表项 会自动转换为按钮(无需data-role="button") 为列表添加圆角和外边距:data-inset="true" e.g.原创 2014-02-25 11:37:01 · 799 阅读 · 0 评论 -
jQuery Mobile 工具栏
页眉栏:通常包含标题/Logo,或一到两个按钮 2个按钮时,会自动分列两侧 1个按钮时,会默认位于左侧 会自动居中 可设定按钮位置:class="ui-btn-right" e.g.原创 2014-02-24 11:09:52 · 668 阅读 · 0 评论 -
jQuery Mobile 导航栏
导航栏: data-role="navbar" 通常位于页眉或页脚(也可以位于内容中) 由水平排列的链接构成,其中的链接会自动转换为按钮(无需data-role="button) 当包含的链接按钮数>5时,会以多行(每行2个)显示 链接的按钮图标定位: data-iconpos="left | ri原创 2014-02-24 15:08:55 · 685 阅读 · 0 评论 -
jQuery Mobile 网格
布局网格:是一种基于CSS的列布局方案。 由于移动设备的屏幕宽度所限,一般不推荐在移动设备上使用列布局 在定位更小的元素时,可以使用到。 网格中列是等宽的,无边框、背景、外边距、内边距 2列:ui-grid-a(子元素:ui-block-a|b)原创 2014-02-24 17:30:10 · 910 阅读 · 0 评论 -
jQuery Mobile 按钮
三种方式创建按钮: 按钮 //用于表单提交 //用于表单提交 按钮 //推荐用这种形式的按钮导航按钮: 转到page2 行内按钮:data-inline="true" 可使按钮宽度自适应其内容 (按钮默认情况会占据屏幕的全部宽度) 转到page2组合按钮:dat原创 2014-02-21 16:52:09 · 1176 阅读 · 0 评论 -
jQuery Mobile 页面事件
1. 页面初始化事件: pagebeforecreate - 页面即将初始化(即在页面创建前) pagecreate - 页面创建 pageinit - 页面初始化 $(document).on("pagebeforecreate", function (event) {// ..... });2.原创 2014-03-17 11:00:25 · 719 阅读 · 0 评论