zoukankan      html  css  js  c++  java
  • jquery 清除动画队列不疑惑

    $(this).siblings().stop().fadeTo(200, 0.3);
    jquery动画存在一个队列, 会把事件产生的动画 放在一个队列中,当来不及执行这些事件队列的时候,会在事件结束后, 继续执行

    应用场景: 为了消除像 "mouseover / mouseout / mouseenter / mouseleave " 这些事件积累的动画队列引起的 "闪烁" 问题,需要在
    某些情况下, 先清除前面积累的动画队列, 最后再执行最后的一个动画动作.

    这个清除元素上积累的动画队列 的命令就是 "stop()". 它带有两个参数:
    先看看w3school对stop()的解释, 这个最权威:

    jQuery stop() 方法用于停止动画或效果,在它们完成之前。
    stop() 方法适用于所有 jQuery 效果函数,包括滑动、淡入淡出和自定义动画。show, hide, toggle并不能算动画, 实质就是css的静态效果.
    
    $(selector).stop(stopAll,goToEnd);
    最重要的是, 要真正明白它的两个参数的含义:
    [可选的 stopAll ]参数规定是否应该清除动画队列。默认是 false,即仅停止活动的动画,允许任何排入队列的动画向后执行。
    [可选的 goToEnd ]参数规定是否立即完成当前动画。默认是 false。即就停在当前状态.
    
    因此,本来, 默认地,stop() 只是去 清除在被选元素上指定的当前动画。
    
    stop(isStopAll, isGoToEnd)
    // 默认的参数是true, false
    // stop(true, false) 清除所有的队列, 不要继续执行完当前未执行完的动画
    // 清除动画队列: 不是恢复到动画执行之前的状态, 而是执行到哪里, 就停止在哪里. 
    // 如果该动画设置了 **执行完毕后** 的回调函数,则不会执行该回调函数(因为动画并没有执行完毕)
    // 如果使用stop()方法,则会立即停止当前正在运行的动画,
    
    // 参数isGoToEnd:是否将当前动画效果执行到最后,意思就是, 停止当前动画的时候, 假设动画效果刚刚执行了一般,
    // 这个时候想要的是 "动画执行之后的效果,那么这个参数就为true"。否则动画效果就会停在stop执行的时候
    
    如果接下来还有动画等待执行,(这也是常常用到的情况, 要不然也不会去管stop()了)则 "以当前状态开始" 接下来的动画。
    

    stop()不疑惑: 在实际开发中, 用得最多的就是stop(true, true). 首先去清除对象上 当前(当前动画 随便参数怎样是一定要清除的)以及后续的所有动画队列, 并且一般要让当前动画执行完毕 (注意, 这个执行完毕, 并不是要有这个中间的执行过程的, 而是直接就跳到 当前动画如果没有clear时应该到达到最后状态). 然后再使用最后的一个动画动作. 很少有单独的 单纯的 去使用stop()方法的!

    $('ol li').mouseover(function(){
        $(this).siblings().stop(true, true).fadeTo(300, 0.3);
    });
    $('ol li').mouseout(function(){
        $(this).siblings().stop(true, true).fadeTo(300, 1);
    });
    
    

    在很多编程语言中, 这里就说js jquery php 都支持 代码书写对齐 风格:

    • 目的是 让代码 好看 工整 优雅
    • 什么叫优雅, 高质量代码叫优雅. 写代码就像写诗一样优雅, 程序代码的书写风格和排列方式, 正好跟写诗的代码 排列风格相类似, 都是长短句,有时候是一个单词 一个字 一个括号{,} 占一行, 所以, 好的工整的 代码看起来就像一首诗一样, 赏心悦目! 比一般的八股文要优雅得多.
    • 所以, 写代码时一定要 有意识的 去排列 对齐你的代码. 而且js jquery php 也支持这样的排列:
    • 这些语言中, 回车 就等同于 空格 等同于 tab. 你可以为了对齐你的代码, 让你的代码更工整 "优雅", 可以"任意"的使用这三种 排版符号. 当然, 对你的代码执行没有任何影响!
  • 相关阅读:
    洛谷1525关押罪犯——二分
    洛谷P1525关押罪犯——二分做法
    poj2411铺砖——状压DP
    1 理解Linux系统的“平均负载”
    3.2-3 tac、more
    3.20 tr:替换或删除字符
    3.14-19 wc、iconv、dos2unix、diff、vimdiff、rev
    3.21-22 od、tee
    指针和引用的区别
    new与malloc区别
  • 原文地址:https://www.cnblogs.com/bkylee/p/5257453.html
Copyright © 2011-2022 走看看