转自原文 jquery mobile常用的data-role类型介绍

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       翻转

jquery mobile常用的data-role类型介绍的更多相关文章

  1. jQuery Mobile 1.1八大新特性介绍

    随着HTML 5时代的来临,移动开发开始进入了一个新的时代,现在只需要懂得HTML5,配合一定的开发框架,就可以开发出十分漂亮的HTML5的移动应用.在众多的 移动HTML5开发框架中,比较著名的是j ...

  2. !!! jquery mobile常用代码

    Jquery MOBILE:  (2014-7-1 发布jquery.mobile 1.4.3版本) <!doctype html> <html> <head> & ...

  3. jquery mobile常用的data-role类型

    data-role参数表: page        页面容器,其内部的mobile元素将会继承这个容器上所设置的属性 header     页面标题容器,这个容器内部可以包含文字.返回按钮.功能按钮等 ...

  4. jquery mobile常用的data-role类型 data-icon data-iconpos

    文章链接: http://blog.csdn.net/cainiaoxiaozhou/article/details/48521241

  5. Jquery Mobile 常用参数

    data-role  属性值: data-role参数表: page        页面容器,其内部的mobile元素将会继承这个容器上所设置的属性  header     页面标题容器,这个容器内部 ...

  6. How to update jQuery Mobile in Dreamweaver CS6

    来源:http://wpguru.co.uk/2013/01/how-to-update-jquery-mobile-in-dreamweaver-cs6/ Since the release of ...

  7. Jquery mobile div常用属性

    组件 页面 jQuery Mobile 应用了 HTML5 标准的特性,在结构化的页面中完整的页面结构分为 header. content.footer 这三个主要区域. 在 body 中插入内容块: ...

  8. jquery ajax中支持哪些返回类型以及js中判断一个类型常用的方法?

    1 jquery ajax中支持哪些返回类型在JQuery中,AJAX有三种实现方式:$.ajax() , $.post , $.get(). 预期服务器返回的数据类型.如果不指定,jQuery 将自 ...

  9. jQuery Mobile Data 属性

    按钮 带有 data-role="button" 的超链接.button 元素.工具栏中的链接以及 input 字段都会自动渲染成按钮样式,不需要添加 data-role=&quo ...

随机推荐

  1. jsp不通过form和Ajax提交

    在页面里面我们一般都通过form表单和Ajax向后台提交请求,但是我如今页面没有form表单,也不想通过ajax异步提交. 解决方式例如以下:location.href="${rootPat ...

  2. 具体图解 Flume介绍、安装配置

    写在前面一: 本文总结"Hadoop生态系统"中的当中一员--Apache Flume 写在前面二: 所用软件说明: 一.什么是Apache Flume 官网:Flume is a ...

  3. 数组进行多少次OP操作,才干有序

    1 题目描写叙述: 有一个数组:2,1,4,3.对于数组,有一种操作op(idx):将该index相应的数字移到首位.比方: op(3):  2 1 43 -> 3 2 1 4 op(1):   ...

  4. 杂项:ExtJS

    ylbtech-杂项:ExtJS extjs是一种软件.自动生成行号,支持checkbox全选,动态选择显示哪些列,支持本地以及远程分页,可以对单元格按照自己的想法进行渲染,这些也算可以想到的功能. ...

  5. Laravel异常处理

    Laravel异常处理 标签(空格分隔): php 自定义异常类 <?php namespace App\Exceptions; use Throwable; use Exception; cl ...

  6. Kylin基础教程(一)

    一.Kylin介绍 1.1 现状 Hadoop于2006年初步实现,改变了企业级的大数据存储(基于HDFS)和批处理(主要基于MR)问题,10几年过去了,数据量随着互联网的发展井喷式增长,如何高速.低 ...

  7. JQuery 登录窗口的布局

    <!-- Button trigger modal --><button type="button" class="btn btn-primary bt ...

  8. redis的主从模式

    主从通信过程 Master配置: 1:关闭rdb快照(备份工作交给slave) 2:可以开启aof slave配置: 1: 声明slave-of slaveof 192.168.0.102 2: 配置 ...

  9. week4_notebooke1

    今日大纲:01名称空间,作用域,取值顺序02函数的嵌套03内置函数 globals() locals()04关键字global nonlocal05函数名的应用06闭包07装饰器初识08装饰器进阶 注 ...

  10. oracle错误ORA-00604 递归sql级别1出现错误 ora-00942 表或试图不存在 ORA-06512 在line 11

    错误截图如下: 搜索了很多方法,但是都没有办法解决,不过最终还是找到了一个好的解决办法, 多谢那位仁兄的博客[http://blog.itpub.net/519536/viewspace-689469 ...