转自原文 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. JDBC 具体解释(1)

    JDBC 具体解释(1)         在以java application server应用为主的平台是,JDBC的最高级应用是DataSource的实现,其他的JDO,webcache,hibe ...

  2. Methods Collection of Enumerating Com Port in Windows, by C

    According to this stack overflow thread, PJ Naughter has implemented 9 methods to emunerate com port ...

  3. php5.5安装笔记

    这次没想到本来很简单的php编译,没想到遇到那么多问题.再此记录一下. 1.php5.5编译安装主要有一个难点,就是GD库的问题,因为php5.5的GD库必须是2.1以上的版本哦 原来都是用的gd2. ...

  4. java中的NIO

    使用传统的输入输出流,当读取输入流中的数据如果没有没有读到有效的数据时,程序将在此处阻塞该线程的执行(使用InputStream的read方法从流中读取数据时,如果数据源中没有数据,它也会阻塞该线程) ...

  5. oracle 11gR2 如何修改 private ip

    1.1    修改 private ip1.1.1  确保crs集群是打开的可以用olsnodes –s 检查集群的状态./olsnodes -sP570a ActiveP570b Active1.1 ...

  6. BigInteger类型转换成Long类型或int类型问题

            BigInteger bi = new BigInteger("123");           int i = bi.intValue();         lo ...

  7. Hadoop 三剑客之 —— 分布式文件存储系统 HDFS

    一.介绍 二.HDFS 设计原理     2.1 HDFS 架构     2.2 文件系统命名空间     2.3 数据复制     2.4 数据复制的实现原理     2.5 副本的选择     2 ...

  8. matlab基本语法

    MATLAB基本语法 点乘运算 , 常与其他运算符 点乘运算,常与其他运算符联合使用(如.\) 矩阵生成 矩阵生成 向量生成或子阵提取本节将会介绍一些MATLAB的基本语法的使用. 持续更新... 在 ...

  9. caffe mnist实例 --lenet_train_test.prototxt 网络配置详解

    1.mnist实例 ##1.数据下载 获得mnist的数据包,在caffe根目录下执行./data/mnist/get_mnist.sh脚本. get_mnist.sh脚本先下载样本库并进行解压缩,得 ...

  10. ssh: connect to host port 22: Connection refused

    配置Linux的互信,互信完成后,连接需要+端口才可以​​已经将端口修改为7777,但依旧走的是默认的22端口​​修改方式:​[root@yoon ssh]# vi /etc/servicesssh ...