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. c++读写二进制文件

    要读取文件必须包含<fstream>头文件,这里包含了C++读写文件的方法,可以使用fstream 类,这个类可以对文件进行读写操作.   1.打开文件.   打开文件可以有两种方式,第一 ...

  2. 快速使用node.js进行web开发

    首先关于node.js的学习,这里推荐一本比较好的教程,nodejs web开发指南,该书通俗易懂地将node.js语言特性讲解完之后,又从一个项目角度带领读者使用node.js学习web开发.相信这 ...

  3. Java注释Override、Deprecated、SuppressWarnings详解(过时方法,即将删除的方法或成员变量)

    Override 这个注释的作用是标识某一个方法是否覆盖了它的父类的方法.那么为什么要标识呢?让我们来看看如果不用Override标识会发生什么事情. Deprecated 这个注释是一个标记注释.所 ...

  4. Microsoft .NET Framework NGEN是神马东东?

    简单的说,如果你的程序是基于.net framework的托管代码的话,NGEN服务能让你的程序第二次打开的速度变快. 赶脚是非常pad化的一项服务. http://msdn.microsoft.co ...

  5. 【1】第一次电话面试---上海EMC

    时间是2016//11月,投的是上海的EMC2公司的JavaWeb开发岗,第一次接到的电话面试,问的题目很基础基础,很遗憾,本人在掌握的太不好,回答的很乱,目测定挂.下面记下HR问的问题及回答. 首先 ...

  6. Difference between applicationContext.xml and spring-servlet.xml in Spring Framework

    Question: Are applicationContext.xml and spring-servlet.xml related anyhow in Spring Framework? Will ...

  7. windows下用一台机器配置分布式redis(主从服务器)

    目录1.Replication的工作原理2.如何配置Redis主从复制 1.Replication的工作原理在Slave启动并连接到Master之后,它将主动发送一条SYNC命令.此后Master将启 ...

  8. Scanner概述

    * Scanner:用于接收键盘录入数据. * System类下有一个静态的字段: * public static final InputStream in; 标准的输入流,对应着键盘录入. * * ...

  9. iOS中定时器的使用

    1. NSTimer 不是很精确 2.CADisplayLink 屏幕 3.通过GCD来实现定时间器 //定时循环执行事件 //dispatch_source_set_timer 方法值得一提的是最后 ...

  10. git 新建项目

    备份. 1.cd dirctory 2.git init 3.git.oschina.net 上新建项目. 4.git remote add origin XXX.git 5.git push ...