在上网的时候经常会发现一些网站上发现一些bug，如导航菜单的动画队列问题（在同一个元素上执行多个动画，那么对于这个动画来说，后面的动画

会被放到动画队列中，等前面的动画执行完成了才会执行）

要解决问题需要停止动画   stop(clearQueue, jumpToEnd)

参数clearQueue     是否清除队列

参数jumpToEnd     是否跳转到最终效果

代码实现：

 $(function () {

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

               $("div").slideDown(1000).slideUp(1000);

           });

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

                //clearQueue第一个参数：是否清除队列

                //jumpToEnd第二个参数：是否跳转到最终效果

                $("div").stop(true,true);

            });

        });

　　

<body>

<input type="button" value="开始" id="btnStart"/>

<input type="button" value="停止" id="btnEnd"/>

    <div></div>

</body>

JQuery动画队列问题的更多相关文章

  1. 深入学习jQuery动画队列

    前面的话 队列实现是jQuery非常棒的一个拓展,使用动画队列可以使动画更容易实现.本文将详细介绍jQuery动画队列 queue() queue()方法用来显示在匹配的元素上的已经执行的函数队列 q ...

  2. jQuery 动画效果 与 动画队列

    基础效果 .hide([duration ] [,easing ] [,complete ]) 用于隐藏元素,没有参数的时候等同于直接设置 display 属性 $('.target').hide() ...

  3. jQuery源码分析系列(39) : 动画队列

    data函数在jQuery中只有短短的300行代码,非常不起点 ,剖析源码的时候你会发现jQuery只要在有需要保存数据的地方无时无刻不依赖这个基础设施 动画会调用队列,队列会调用data数据接口还保 ...

  4. jquery 清除动画队列不疑惑

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

  5. jQuery的动画队列

    动画队列主要用到jQuery的queue.dequeue和clearqueue. 1.queue()函数主要是将一个动画函数数组绑定到一个队列上 2.dequeue()函数主要是执行队列的第一个函数, ...

  6. jQuery动画高级用法（上）——详解animation中的.queue()动画队列插队函数

    决定对animate方面做一些总结,希望能给大家一些启发和帮助 从一个实际应用谈起 今天不谈animate().fadeIn().fadeOut().slideUp().show().hide()诸如 ...

  7. Jquery自定义动画与动画队列

    animate:自定义动画 $(selector).animate({params},[speed],[easing],[callback]); params:要执行动画的css属性,它是一个对象可以 ...

  8. jQuery动画的实现

    没有引入deferred机制,其余流程都有了 //////////// //创建动画缓动对象 // //////////// function Tween(value, prop, animation ...

  9. 深入学习jQuery动画控制

    × 目录 [1]动画状态 [2]停止动画 [3]动画延迟[4]全局控制 前面的话 jQuery动画可以使用fade.hide.slide等方法实现基本动画效果,可以使用animate实现自定义动画,甚 ...

随机推荐

  1. 【三石视频教程】当FineUIPro遇到ReportViewer

    FineUIPro 下个版本(v2.8.0)即将支持 ReportViewer,为此三石特别制作了一期视频教程,供大家参考. 运行效果图:   视频下载:http://pan.baidu.com/s/ ...

  2. solr.net的使用

    引子 最近在做一个日志系统,用普通关系型数据库做数据查询遇到了查询的瓶颈,想到了用成熟的搜索应用服务,我所知道的比较成熟的搜索应用服务有solr和es(elasticsearch),由于时间比较仓促, ...

  3. SQLite源程序分析之sqlite3.c

    /****************************************************************************** ** This file is an a ...

  4. logback 常用配置详解<appender>

    logback 常用配置详解 <appender> <appender>: <appender>是<configuration>的子节点,是负责写日志的 ...

  5. IO多路复用概念性

    sellect.poll.epoll三者的区别 先来了解一下什么是进程切换 为了控制进程的执行,内核必须有能力挂起正在CPU上运行的进程,并恢复以前挂起的某个进程的执行,这种行为为进程的切换,任务切换 ...

  6. 以 Console 方式运行、调试、编译 .Net 编写的 Windows 服务

    经常看到一些人在调试 Windows 服务时,很执著的在附加进程后调试!其实 .Net 编写的 Windows 应用程序,包括 Windows 服务都可以编译成 Console 程序!甚至于 ASP. ...

  7. UIDynamic--动力元素行为:UIDynamicItemBehavior

    属性分析: @property (nonatomic, readonly, copy) NSArray* items; @property (readwrite, nonatomic) CGFloat ...

  8. sql 单个字段去重查询 distinc 和 group by的效率问题

    sql 查询 distinc用法 distinct 和group by都需要排序,一样的结果集从执行计划的成本代价来看差距不大,但group by 还涉及到统计,所以应该需要准备工作.所以单纯从等价结 ...

  9. Ubuntu安装RobotFramework

    安装Python Ubuntu默认已安装 安装pip wget https://bootstrap.pypa.io/get-pip.py python get-pip.py 安装RobotFramew ...

  10. 10个常见的Node.js面试题

    如果你希望找一份有关Node.js的工作,但又不知道从哪里入手评测自己对Node.js的掌握程度. 本文就为你罗列了10个常见的Node.js面试题,分别考察了Node.js编程相关的几个主要方面. ...