jQuery Mobile 包含了允许您选择页面打开方式的 CSS 效果。

jQuery Mobile 过渡效果

jQuery Mobile 拥有一系列关于如何从一页过渡到下一页的效果。

注释:如需实现过渡效果,浏览器必须支持 CSS3 3D 转换:

浏览器支持

  • Internet Explorer 10 支持 3D 转换(更早的版本不支持)
  • Opera 仍然不支持 3D 转换

过渡效果可应用于任意链接或通过使用 data-transition 属性进行的表单提交:

<a href="#anylink" data-transition="slide">滑动到页面二</a>

下面的表格展示了可与 data-transition 属性一同使用的可用过渡:

提示:在 jQuery Mobile 中,淡入淡出效果在所有链接上都是默认的(如果浏览器支持)。

提示:以上所有效果同时支持反向动作,例如,如果您希望页面从左向右滑动,而不是从右向左,请使用值为 "reverse" 的 data-direction 属性。在后退按钮上是默认的。

实例:

<a href="#pagetwo" data-transition="slide" data-direction="reverse">滑动</a>

  

jQuery Mobile 过渡效果的更多相关文章

  1. jquery mobile 学习总结

    <!doctype html><html lang="zh-CN"><head> <meta charset="UTF-8&qu ...

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

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

  3. 使用JQuery Mobile实现手机新闻浏览器

    jQuery Mobile项目是jQuery项目下的在移动开发方面的又一力作,在本文中,笔者将带你一步步更深入学习使用jQuery Mobile框架去实现一个能在android手机上运行的新闻浏览器, ...

  4. jQuery Mobile基础

    1.安装 在<head></head>标签里边写入以下内容 jQuery Mobile CDN: <head> <meta charset="utf ...

  5. Jquery Mobile笔记之一

    jQuery Mobile 在你的网页中添加 jQuery Mobile 你可以通过以下几种方式将jQuery Mobile添加到你的网页中: 从 CDN 中加载 jQuery Mobile (推荐) ...

  6. jQuery Mobile 所有data-*选项,开发全解+完美注释

    全栈工程师开发手册 (作者:栾鹏) jQuery Mobile事件全解 jQuery Mobile 所有class选项 jQuery Mobile 所有data-*选项 jQuery Mobile 所 ...

  7. jquery mobile小案例

    ---恢复内容开始--- [jquery mobile小案例]效果图如下: 首先先创建一个页面主要使用data-role="page"这个指令,我们给它起个id="pag ...

  8. Jquery Mobile基本元素

    移动端框架 安装: CDN: <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jq ...

  9. jQuery Mobile基本UI组件

    基本页面构造 <!DOCTYPE html> <html> <head> <link rel="stylesheet" href=&quo ...

随机推荐

  1. CSS 分组

    选择器分组 假设希望 h2 元素和段落都有灰色.为达到这个目的,最容易的做法是使用以下声明: h2, p {color:gray;} 将 h2 和 p 选择器放在规则左边,然后用逗号分隔,就定义了一个 ...

  2. LeetCode "Top K Frequent Elements"

    A typical solution is heap based - "top K". Complexity is O(nlgk). typedef pair<int, un ...

  3. Hadoop的管理目录

    HDFS文件结构 1.NameNode的文件结构,NameNode会创建VERSION.edits.fsimage.fstime文件目录.其中dfs.name.dir属性是一个目录列表,是每个目录的镜 ...

  4. Eclipse启动Tomcat后无法访问项目

    Eclipse中的Tomcat可以正常启动,不过发布项目之后,无法访问,包括http://localhost:8080/的小猫页面也无法访问到,报404错误.这是因为Eclipse所指定的Server ...

  5. Linux经典书籍推荐

    入门篇 <LINUX权威指南>书不错,写的很全面也比较广,涉及的不深,做为入门书籍不错,可以比较全面的了解linux .另外比较热门的也可以看看<鸟哥的私房菜>等书,偏管理类的 ...

  6. EBS应用服务器启动指南

    1.ssh应用服务器    applprod用户密码:*** 管理脚本在$ADMIN_SCRIPTS_HOME路径下 adstrtal.sh       启动所有服务,命令行为adstrtal.sh ...

  7. C#EXCEL 操作类--C#DataToExcel帮助类

    using System; using System.Diagnostics; //using Excel; namespace DotNet.Utilities {     /// <summ ...

  8. lua 高级

    io操作: io.input(filename):指定一个输入流,可以是标准输入stdin,也可以是一个文件路径,返回一个文件句柄: io.output(filename):指定一个输出流,可以是标准 ...

  9. Spring:No bean named 'beanScope' is defined

    初学Spring,“No bean named 'beanScope' is defined”这个问题困扰了我好几个小时,查资料无果后,重写好几遍代码后发现问题居然是配置文件不能放在包里...要放在s ...

  10. 项目名 的在JSP或JAVA中的另类写法

    在JSP页面中${pageContext.request.contextPath } 表示项目名<form action="${pageContext.request.contextP ...