jquery中的data-icon和data-role

jquery中的data-icon和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参数表：
    arrow-l  左箭头图标
    arrow-r  右箭头图标
    arrow-u  上箭头图标
    arrow-d  下箭头图标
    plus     加号图标
    minus    减号图标
    delete   删除图标
    check    检查图标
    home     首页图标
    info     信息图标
    back     后退图标
    forward  向前图标
    refresh  刷新图标
    grid     网格图标
    gear     齿轮图标
    search   搜索图标
    star     星形图标
    alert    提醒图标

<!DOCTYPE html>

<html>

<head>

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css">

<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>

<script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>

</head>

<body>

<div data-role="page" id="pageone">

<div data-role="content">

<a href="#" data-role="button" data-icon="arrow-l">左箭头图标</a>

<a href="#" data-role="button" data-icon="arrow-r">右箭头图标</a>

<a href="#" data-role="button" data-icon="arrow-u">上箭头图标</a>

<a href="#" data-role="button" data-icon="arrow-d">下箭头图标</a>

<a href="#" data-role="button" data-icon="plus">加号图标</a>

<a href="#" data-role="button" data-icon="minus">减号图标</a>

<a href="#" data-role="button" data-icon="delete">删除图标</a>

<a href="#" data-role="button" data-icon="check">检查图标</a>

<a href="#" data-role="button" data-icon="home">首页图标</a>

<a href="#" data-role="button" data-icon="info">信息图标</a>

<a href="#" data-role="button" data-icon="back">后退图标</a>

<a href="#" data-role="button" data-icon="forward">向前图标</a>

<a href="#" data-role="button" data-icon="refresh">刷新图标</a>

<a href="#" data-role="button" data-icon="grid">网格图标</a>

<a href="#" data-role="button" data-icon="gear">齿轮图标</a>

<a href="#" data-role="button" data-icon="search">搜索图标</a>

<a href="#" data-role="button" data-icon="star">星形图标</a>

<a href="#" data-role="button" data-icon="alert">提醒图标</a>

</div>

</body>

</html>

jquery中的data-icon和data-role相关推荐

深入jQuery中的data()
引入 data函数在jQuery中看起来很不起眼, 就像沙滩上一颗平凡的沙子, 但仔细一瞅, 却惊讶的发现data是jQuery中无比重要的一环, 甚至jQuery中各种事件都基于此. data有什么 ...
关于Jquery中ajax方法data参数用法的总结
关于Jquery中ajax方法data参数用法的总结 jquery手册描述: 示例: $.ajax({type: "POST",url: "some.php", ...
jQuery 中 data 方法的实现原理
jQuery 中 data 方法的实现原理前言:jQuery 作为前端使用最多最广泛的 JS 库,其源码每个 JSer 都应该研究一下.早就打算看却一直被各种事拖着,上次某公司面试时被问到 jQue ...
网页中遇到的src=quot;data:image/png;base64，xxxxquot;知识点了解
在学爬虫中,总是习惯去找网上图片的url,但是你一定会遇到我题目说说的问题.网页上有些图片的src或css背景图片的url后面跟了一大串字符,比如: data:image/png;base64,/9j ...
浏览器中的data类型的Url格式,data:image/png,data:image/jpeg!
所谓"data"类型的Url格式,是在RFC2397中提出的,目的对于一些"小"的数据,可以在网页中直接嵌入,而不是从外部文件载入.例如对于img这个Tag, ...
webservice mysql配置文件_在WebService中使用Microsoft.Practices.EnterpriseLibrary.Data配置数据库...
标签: 1. 新建WebApplication1项目 1.1 新建-Web-ASP.NET Empty Web Application--WebApplication1 1.2 添加一个WebForm ...
浏览器中的data类型的Url格式,data:image/png,data:image/jpeg! 收藏苏生不惑发表于 4年前阅读 3943 收藏 3 点赞 0 评论 0 腾讯云·
浏览器中的data类型的Url格式,data:image/png,data:image/jpeg! 收藏苏生不惑发表于 4年前阅读 3943 收藏 3 点赞 0 评论 0 腾讯云·云上实验室:开 ...
数据湖 data lake_在Data Lake中高效更新TB级数据的模式
数据湖 data lake GOAL: This post discusses SQL "UPDATE" statement equivalent for a data lake ...
解决Android中的ERROR: the user data image is used by another emulator. aborting的方法
解决Android中的ERROR: the user data image is used by another emulator. aborting的方法今天调试代码的时候,突然出现这个错误,折腾 ...
vue中this.init用法_Vue中的this.$options.data()和this.$data用法说明
问题项目里遇到一个问题,用this.$options.data()重置组件data时,data()里用this获取的props或method都为undefined,代码简化如下: export de ...

jquery中的data-icon和data-role

jquery中的data-icon和data-role

jquery中的data-icon和data-role相关推荐

最新文章

热门文章