jquery mobile常用的data-role类型

本文深入探讨jQueryMobile框架的各个核心组件及其使用方法,包括页面容器、标题、页脚、内容容器、控件组、区域包裹容器、功能导航容器、列表展示容器等,并详细解析data-role、data-transition、data-icon、data-iconpos等关键参数的作用。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

data-role参数表:

page 页面容器,其内部的mobile元素将会继承这个容器上所设置的属性

header 页面标题容器,这个容器内部可以包含文字、返回按钮、功能按钮等元素

footer 页面页脚容器,这个容器内部也可以包含文字、返回按钮、功能按钮等元素

content 页面内容容器,这是一个很宽容的容器,内部可以包含标准的html元素和jQueryMobile元素

controlgroup 将几个元素设置成一组,一般是几个相同的元素类型

fieldcontain 区域包裹容器,用增加边距和分割线的方式将容器内的元素和容器外的元素明显分隔

navbar 功能导航容器,通俗的讲就是工具条

listview 列表展示容器,类似手机中联系人列表的展示方式

list-divider 列表展示容器的表头,用来展示一组列表的标题,内部不可包含链接

button 按钮,将链接和普通按钮的样式设置成为jQueryMobile的风格

none 阻止框架对元素进行渲染,使元素以html原生的状态显示,主要用于form元素。

data-transition参数表:

slide从右侧向左滑入页面

slideup 从底部向上滑入

slidedown 从上向下滑入

pop 从中心渐显展开

fade 渐显

flip 翻转

data-icon参数表:


data-iconpos参数表:

right图标在文字的右侧

top 图标在文字上面

bottom 图标在文字下面

pop 从中心渐显展开

fade 渐显

flip 翻转

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值