.stop()

一. 在使用animate()的时候前面需要加上.stop()来防止移进移出的山东问题。

二.

1.定义： stop() 方法为被选元素停止当前正在运行的动画。

2.语法： $(selector).stop(stopAll,goToEnd)

参数：

stopAll : 可选。规定是否停止被选元素的所有加入队列的动画。默认是 false。

goToEnd : 可选。规定是否立即完成当前的动画。默认是false。该参数只有在设置了stopAll参数时才能使用。

第一个参数的意思是是否清空动画序列，也就是停止的是当前元素的动画效果还是后面附带的所有动画的效果，一般为false,跳过当前的动画效果，执行下一个动画效果。

第二个参数的意思是是否将当前的动画进行到最后，意思就是停止当前动画的时候动画效果刚好执行了一半，这个时候想要的是动画执行之后的效果，那么这个参数就为true。否则动画效果就会停在stop执行的时候。

 <!DOCTYPE html>

 <html>

     <head>

         <meta charset='utf-8'>

         <title>stop的用法案例</title>

         <style type="text/css">

             #animater{

                 width: 150px;

                 background:activeborder;

                 border: 1px solid black;

                 /*为了移动，需设置此属性*/

                 position: relative;

             }

         </style>

         <script type="text/javascript" src='/style/js/jquery-1.10.2.min.js'></script>

         <script type="text/javascript">

             $(function(){

                 $("#start").click(function(){

                     $("#box").animate({height:},"slow");

                     $("#box").animate({width:},"slow");

                     $("#box").animate({height:},"slow");

                     $("#box").animate({width:},"slow");

                 });

                 //           点击不同的button执行不同的操作

                 $('#button1').click(function(){

                     //默认参数是false，不管写一个false还是两个false还是没写false效果一样

                     $('#box').stop();

                 });

                 $('#button2').click(function(){

                     //第二个参数默认false

                     $('#box').stop(true);

                 });

                 $('#button3').click(function(){

                     $('#box').stop(false,true);

                 });

                 $('#button4').click(function(){

                     $('#box').stop(true,true);

                 });

             })

         </script>

     </head>

     <body>

         <p><input type='button' value='开始测试' id='start'></p>

         <div id="button">

             <input type="button" id="button1" value="stop()"/>

             <input type="button" id="button2" value="stop(true)"/>

             <input type="button" id="button3" value="stop(false,true)"/>

             <input type="button" id="button4" value="stop(true,true)"/>

         </div>

         <div id="box" style="background:#98bf21;height:100px;width:100px;position:relative">stop运动参数测试</div>

     </body>

 </html>

随机推荐

JQuery设置时间段下拉选择时间下拉选择
$(document).ready(function() { var arrT = []; var tt = "{0}:{1}"; for (var i = 0; i < 2 ...
app标配控制器：UITabBarController
UITabBarController UITabBarController和UINavigationController类似可以轻松的管理多个控制器,底部有一个条,底部条tabBar的高度是49. U ...
Python学习之路二
今天主要学习了列表,python的列表真的事太强大了,由于内容比较多,今天就先简单的介绍一下新学的几个成员函数吧. 首先我们要了解list是一种序列类型,其构造方式有四种形式: (1)空列表 [] ( ...
#HTML：無序、有序與定義清單
#HTML:無序.有序與定義清單 Maplewing 于星期六, 12/10/2013 - 09:48 提交清單在網頁中是很常使用到的東西,故多少還是要了解一下.在HTML中有三種不太一樣的清單, ...
【iCore2 模块相关资料】iM_LAN 100M 以太网模块UDP例程
============================== 技术论坛:http://www.eeschool.org 博客地址:http://xiaomagee.cnblogs.com 官方网店:h ...
Android 数据库管理— — —创建数据库
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android=" ...
sql语句的匹配
like 的通配符有两种 %(百分号):代表零个.一个或者多个字符. _(下划线):代表一个数字或者字符. 1. name以"李"开头 where name like '李%' 2 ...
MVC 请求处理流程（一）
路由系统先获取路由数据,在实现了IHttpModule接口的UrlRoutingModule对象中通过注册HttpApplication的PostResolveRequestCache来解析路由数据并 ...
Mac下手动安装SafariDriver extension
环境:Mac OS X Yosemite 10.10.4下, Safari 8 Step 1:第一次运行SafariDriver时,先找到WebDriver extension的安装路径,比如/Use ...
iOS学习之MVC模式
Modal 模型对象: 模型对象封装了应用程序的数据,并定义操控和处理该数据的逻辑和运算.例如,模型对象可能是表示商品数据 list.用户在视图层中所进行的创建或修改数据的操作,通过控制器对象传达出去 ...

.stop()

随机推荐

热门专题