jQuery。动画问题，动画不会停止（动画堆叠??）

我有8个缩略图，当你将鼠标移动到第一个行上时，其他7个动画透明度为50％，在鼠标移出时它会将它们带回到100％。对于其他大拇指也是如此。jQuery。动画问题，动画不会停止（动画堆叠??）

问题是，当你从左到右快速开始你的鼠标滑过时，如果你把它们全部真正快速地（从左到右或者从左边看到右边）不要停下来。所以如果我有7张缩略图，并且我快速地将鼠标超越真实，那么他们将播放动画7倍。如果我快速左转右转，那14轮转等....（动画堆栈）

点是动画不停止。我知道为什么但不知道如何解决它。我尝试了.stop()，但是这阻止了整个事情。我也试图减少动画时间，但它已经在500毫秒，所以更短，它像一个常规的开/关开关。我也尝试过.delay（数字在这里），但是耶，没有工作哈哈。

这是Js小提琴。 http://jsfiddle.net/somdow/y3vCP/

以防万一，

在这个例子中（同的jsfiddle）的HTML是：

<div class="portThumbsL"> 
     <a href="images/sitePortThumbs/2882.png"><img src="images/sitePortThumbs/2882.png" alt="2882films"/></a> 
     <div class="thumbTxtSmall">2882FILMS</div> 
    </div> 
    <div class="portThumbsL"> 
     <a href="images/sitePortThumbs/2882.png"><img src="images/sitePortThumbs/1tech.png" alt="1-tech"/></a> 
     <div class="thumbTxtSmall">2882FILMS</div> 
    </div> 
    <div class="portThumbsL"> 
     <a href="images/sitePortThumbs/2882.png"><img src="images/sitePortThumbs/brazen.png" alt="brazen"/></a> 
     <div class="thumbTxtSmall">2882FILMS</div> 
    </div>

CSS中：

.portThumbsL{position:relative; width:245px; height:387px; float:left; background-color:#333; margin-right:14px;} 
.portThumbsR{position:relative;width:245px; height:387px; float:right; background-color:#333; margin-left:px;} 
.portThumbsL img, .portThumbsR img{display:block; margin:6px auto;}

jQuery的是：

$('.portThumbsL , .portThumbsR').hover(function(){ 
    $(this).children('.portSecRollOver').css("display","block"); 
    $(this).find('.portSecInner').html("<h3 class='h34roll'>" + $(this).find('img').attr('alt') + "</h3>"); 
    //$('.portThumbsL, .portThumbsR').not(this).css("opacity", .5); 
    $('.portThumbsL, .portThumbsR').not(this).animate({opacity:.5},500); 
    }, 
    function(){ 
     $(this).children('.portSecRollOver').css("display","none"); 
    $('.portThumbsL, .portThumbsR').not(this).animate({opacity:1},500); 
    });

所以我总的问题是，怎样才能让这个它扮演它应该没有快要疯了。

来源

2012-09-15 somdow

尝试使用停止（），然后clearQueue（）...

$（ 'portThumbsL，.portThumbsR'）不是（这个）.stop（）。clearQueue（） .animate（{不透明度：.5}，500）; （）。（this）.stop（）。clearQueue（） .animate（{opacity：1}，500）;（不透明度：1）。

在这里看到... http://jsfiddle.net/dZY7q/

来源

2012-09-15 15:55:10 Stphane

当你做$ WhatEver.animate（...）JQ看起来在专用功能FIFO堆栈，检查是否有任何：如果有的话，新的动画顺序被排队直到轮到了（所有现有的动画已经播放或清除）。如果没有，前者会立即播放。 – Stphane

jQuery。动画问题，动画不会停止（动画堆叠??）

回答

相关问题