• jquery中stop停止动画笔记


    jQuery stop() 方法用于停止动画或效果,在它们完成之前。

    stop() 方法适用于所有 jQuery 效果函数,包括滑动、淡入淡出和自定义动画。

    语法:

    $(selector).stop(stopAll,goToEnd);

    可选的 stopAll 参数规定是否应该清除动画队列。默认是 false,即仅停止活动的动画,允许任何排入队列的动画向后执行。

    可选的 goToEnd 参数规定是否立即完成当前动画。默认是 false。

    因此,默认地,stop() 会清除在被选元素上指定的当前动画。

    其中

    stop():表示的是停止当前正在进行的动画,但会执行之后还没进行的动画

    stop(true):表示的是停止所有的动画,包括正在进行的和还没有进行的

    stop(true,true):表示的是停止所有的动画,但会将当前正在进行的动画立刻完成

    例子如下:

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js">
    </script>
    <script> 
    $(document).ready(function(){
      $("#start").click(function(){
        $("div").animate({left:'100px'},5000);
        $("div").animate({fontSize:'3em'},5000);
      });
      
      $("#stop").click(function(){
        $("div").stop();
      });
    
      $("#stop2").click(function(){
        $("div").stop(true);
      });
    
      $("#stop3").click(function(){
        $("div").stop(true,true);
      });
      
    });
    </script> 
    </head>
    <body>
    
    <button id="start">开始</button>
    <button id="stop">停止</button>
    <button id="stop2">停止所有</button>
    <button id="stop3">停止动画,但完成动作</button>
    <p>点击 "开始" 按钮开始动画。</p>
    <p>点击 "停止" 按钮停止当前激活的动画,但之后我们能再动画队列中再次激活。</p>
    <p>点击 "停止所有" 按钮停止当前动画,并清除动画队列,所以元素的所有动画都会停止。</p>
    <p>点击 "停止动画,但完成动作" 快速完成动作,并停止它。</p> 
    
    <div style="background:#98bf21;height:100px;200px;position:absolute;">HELLO</div>
    
    </body>
    </html>
    View Code
  • 相关阅读:
    EKLM3S8962之LED
    [uClinuxdev] detecting stack overflow
    Eclipse换行符
    EKLM3S8962之OLED
    Windows 环境下 GNU ARM 开发环境建立
    关于阻焊层和助焊层的理解
    MISRA C 2004中文版
    对话框托盘程序实现源码
    VC++中四种进程或线程同步互斥的控制方法
    Windows线程同步与互斥技术总结
  • 原文地址:https://www.cnblogs.com/fireporsche/p/6394742.html
Copyright © 2020-2023  润新知