《jQuery、jQuery UI及jQuery Mobile技巧与示例》——9.7　技巧：指定过渡动画

本节书摘来自异步社区《jQuery、jQuery UI及jQuery Mobile技巧与示例》一书中的第9章，第9.7节，作者：【荷】Adriaan de Jonge , 【美】Phil Dutson著，更多章节内容可以访问云栖社区“异步社区”公众号查看

9.7 技巧：指定过渡动画

当点击一个会使用AJAX加载页面的内部链接时，jQuery Mobile提供了过渡动画。默认情况下，你会看到页面滑向左侧。

jQuery Mobile准备了少量的默认动画供你选择。它们是pop、slidefade、slide、slideup、slidedown、fade和flip。代码清单9-8演示了如何更改链接上的动画。

代码清单9-8 使用动画导航至第二张页面

00 !DOCTYPE html 

01 html 

02 head 

03 title Transition /title 

04 meta name="viewport" 

05 content="width=device-width, initial-scale=1" 

06 link rel="stylesheet" href=

07 "http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" 

08 script type="text/javascript"

09 src="http://code.jquery.com/jquery-1.7.1.min.js" 

10 /script 

11 script type="text/javascript" src=

12 "http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js" 

13 /script 

14 /head 

15 body 

17 div data-role="page" 

19 div data-role="header" 

20 h1 First /h1 

21 /div 

23 div data-role="content" 

24 p Hello world a href="#second" data-transition="pop" and go

25 to the second /a /p 

26 !-- or slide, slipdeup, slidedown, fade or flip 

27 (support for flip is limited on Android) -- 

28 /div 

30 /div 

32 div data-role="page" id="second" 

34 div data-role="header" 

35 h1 Second /h1 

36 /div 

37 div data-role="content" 

38 Hello again!

39 /div 

41 /div 

43 /body 

44 /html 

第24行引进了data-transition属性。这个属性也可用于form元素上。框架底层会处理动画。

【jQuery动画】停止动画、淡入淡出、自定义动画 动画队列中所有动画都是按照顺序执行的，默认只有当前的一个动画执行完毕，才会执行后面的动画。为此，jQuery提供了stop（）方法用于停止动画效果。通过此方法，可以让动画队列后面的动画提前执行。
【jQuery动画】显示与隐藏效果 在网页开发中，适当地使用动画可以使页面更加美观，进而增强用户体验。jQuery中内置了一系列方法用于实现动画，当这些方法不能满足实际要求时，用户也可以自定义动画。本期我们一起来了解一下显示与隐藏效果吧~
jQuery——动画，显示与隐藏，获取，添加 必需的 params 参数定义形成动画的 CSS 属性 可选的 speed 参数规定效果的时长，可以取以下值：“slow”、“fast” 或毫秒。 可选callback 参数是动画完成后所执行的函数名称
jQuery中的自带动画 jQuery中的自带动画 jQuery是一个非常强大的JavaScript库，它提供了很多非常有用的功能，其中包括动画。 在前端的实际开发中，我们经常会遇到一些动画效果，比如：鼠标移入移出，点击，滚动等等。这些动画效果，我们可以使用jQuery来实现。下面我们就来看看jQuery中的动画。
异步社区 异步社区(www.epubit.com)是人民邮电出版社旗下IT专业图书旗舰社区，也是国内领先的IT专业图书社区，致力于优质学习内容的出版和分享，实现了纸书电子书的同步上架，于2015年8月上线运营。公众号【异步图书】，每日赠送异步新书。