如何清除动画缓冲区 [英] How to clear the animate buffer

问题描述

我用下拉菜单做了一个水平导航，

并且当用户将鼠标悬停在菜单项上时编码就好了

下拉列表出现带有动画效果，但我徘徊

鼠标迅速超过菜单项和下拉菜单同时出现了多次徘徊时的
，我认为动画

缓冲区填充，这就是为什么下拉菜单显示的原因喜欢这个



这里是代码：

 $（ ＃topNav> ul> li）。hover（function（）{
  var  liNum = $（ this ）。find（  ul）。find（  li）。length; 
  var  liHeight = $（ this ）。height（）; 
  var  i =  1 ; 
  var  minus =  20 ; 
 $（ this ）。find（  ul）。find（  li）。each（function（）{
  if （i <  = liNum）{
 $（此）。animate（{  opacity：  1，  top :(（i * liHeight）-minus）+   px}，{duration： 300 }）; 
减去 - ; 
 i ++; 
} 
} ）; 
  if （滚动）{
 $（ this ）。find（  ul）。find（  li）。first（）。addClass（  dropFirstChild< /跨度>）; 
} 
  else  {} 
}，function（）{
 $（ ＃topNav> ul> li> ul> li）。animate（{  top：  0 ，  opacity：  0}，{duration： 100 }）; 
 $（ ＃topNav> ul> li> ul> li ）.first（）。removeClass（  dropFirstChild）; 
}）; 

如果出现问题我怎么能清除缓冲区并摆脱它！

解决方案

（ ＃topNav> ul> li）。hover（function（）{
var liNum =

（ this ）。find（ ul）。find（ li）。length;
var liHeight =

（ this ）。height（）;
var i = 1 ;
var minus = 20

i made a horizontal nav with dropdowns ,
and code it like when user hovers mouse on menu items
dropdowns appear with an animate effect, but i hovered
mouse rapidly over menu items and dropdowns showed up
at the same time after too many hovers, i think animate
buffer filled and that's why dropdowns showed like that

here's the code:

$("#topNav > ul > li").hover(function(){
        var liNum = $(this).find("ul").find("li").length;
        var liHeight = $(this).height();
        var i = 1;
        var minus = 20;
        $(this).find("ul").find("li").each(function(){
            if(i <= liNum){
                $(this).animate({"opacity":"1" , "top":((i*liHeight)-minus)+"px"} , {duration: 300});
                minus --;
                i++;
            }
        });
        if(scrolled){
            $(this).find("ul").find("li").first().addClass("dropFirstChild");
        }
        else{}
    },function(){
        $("#topNav > ul > li > ul > li").animate({"top":"0" , "opacity":"0"} , {duration:100});
        $("#topNav > ul > li > ul > li").first().removeClass("dropFirstChild");
    });

how can i clear the buffer if it's the problem and get rid of it!

解决方案

("#topNav > ul > li").hover(function(){ var liNum =

(this).find("ul").find("li").length; var liHeight =

(this).height(); var i = 1; var minus = 20;

这篇关于如何清除动画缓冲区的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！