注意1,只有hover事件后才能紧跟着第二个回调函数(mouseleave),尽量还是不使用mouseover事件了

注意2,.stop(false,true); 结束动画,在动画队列中删除自己,并且直接按照原计划的动画效果的完成结果体现结束。

    $(".header-list li").hover(function(e){
slideDowning = true;
var selector = $(this).children('ul');
if(!selector.is(":animated")) {
selector.slideDown(100);
} else {
selector.stop(false,true);
}
},function(){
slideUping = true;
var selector = $(this).children('ul');
if(!selector.is(":animated")) {
selector.slideUp(100);
} else {
selector.stop(false,true);
}
})

jquery 温故而知新 animate动画的一些坑的更多相关文章

  1. jQuery中animate动画第二次点击事件没反应

    jQuery中animate动画第二次点击事件没反应 用animate做点击翻页动画时发现第二次点击事件动画没反应,而第一次点击有动画效果,代码如下: 复制代码 代码如下: $(".page ...

  2. jquery的animate({})动画整理

    在网页制作的过程中少不了用到各种动画,形式多种多样,flash,css,js,canvas,等等都能实现,对于其优劣和效果只能说各有千秋. 什么是动画效果,其实网页中的渐变效果就是一种很基础的动画,动 ...

  3. 自定义jQuery的animate动画

    //擦除效果 jQuery.extend(jQuery.easing, { easeOutBack : function(x, t, b, c, d, s) { s = s || 1.3; retur ...

  4. 用jquery的animate动画函数做的网页效果

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. jquery 停止animate动画,并且回复最初状态

    // 热门推荐悬浮效果 $("#recom_con li img").mouseenter(function(){ $(this).stop(true, true); $w = p ...

  6. jquery的animate动画

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  7. js实现jquery函数animate动画效果

    <script> function animate(obj, json, interval, sp, fn) { clearInterval(obj.timer); function ge ...

  8. Jquery如何使用动画效果改变背景色

    Jquery如何使用动画效果改变背景色 一.问题引入 jquery的animate动画虽然强大,但是无法使用其进行背景色(background-color)的动画效果变化,因为animate动画效果只 ...

  9. jquery animate 动画效果使用解析

    animate的意思是:使有生气:驱动:使栩栩如生地动作:赋予…以生命作为形容词:有生命的:活的:有生气的:生气勃勃的 先看动画效果:http://keleyi.com/keleyi/phtml/jq ...

随机推荐

  1. ViewPager的广告条轮播

    首先布局 <?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:androi ...

  2. cf #365b 巧妙的统计

     Mishka and trip time limit per test 1 second memory limit per test 256 megabytes input standard inp ...

  3. XSS 跨站脚本攻击之构造剖析(一)

    1.XSS-Filter:跨站脚本过滤器,用于分析用户提交的输入,并消除潜在的跨站脚本攻击 (1)XSS Filter实际上是一段精心编写的过滤函数作用是过滤XSS跨站脚本代码: (2)绕过XSS F ...

  4. DOM系列---基础篇

    DOM系列---基础篇   DOM (Document Object Model) 即文档对象模型, 针对 HTML 和 XML 文档的 API (应用程序接口) .DOM 描绘了一个层次化的节点树, ...

  5. 并查集(加权) LA 4487 Exclusive-OR

    题目传送门 题意:训练指南P245 分析:首先这道是经典的并查集题目,利用异或的性质.异或性质:x ^ 0 = x -> a ^ a = 0 -> x ^ a ^ a = x,即一个数对某 ...

  6. Python基础9- 字典

    #coding=utf8#字典由键和对应的值组成(键值对)--哈希表,字典元素也可以为空 dict1 = {'name':'kaly','age':20,'sex':'male'}dict2 = {} ...

  7. three.js 显示一条线

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  8. WPF DataGrid – Dynamically updating DataGridComboBoxColumn

    The Scenario I want to do a master detail like scenario where the selection in one ComboBox cell wil ...

  9. ASP.NET 操作Cookie详解 增加,修改,删除

    Cookie,有时也用其复数形式Cookies,指某些网站为了辨别用户身份而储存在用户本地终端上的数据(通常经过加密).定义于RFC2109.它是网景公司的前雇员Lou Montulli在1993年3 ...

  10. Diophantus of Alexandria[HDU1299]

    Diophantus of Alexandria Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Ot ...