0

我有一个带有 3 个图像的横幅，我希望使用 jQuery 淡入和淡出。我使用以下代码使这部分工作正常：

$j(文档).ready(函数() {
        初始化横幅（）；
  startLoop = setInterval(initBanner,50000);

  函数初始化横幅（）{
   $j("##image1").delay(10000).fadeOut(1500, function(){
    $j("##image2").fadeIn(1000, function(){
     $j("##image2").delay(10000).fadeOut(1500, function(){
      $j("##image3").fadeIn(1000, function(){
       $j("##image3").delay(10000).fadeOut(1500, function(){
        $j("##image1").fadeIn(1000);
        //inMotion = false;
       });  
      });
     });
    });
   });
  }

然而，横幅下方是 3 个链接，其中包含与它们相关的图像。当我在按钮上鼠标输入时，我想将淡入和淡出的图像更改为与按钮相关的图像。

我试过了

清除间隔（开始循环）
但是，这会等待动画完成后再清除。我想要的是能够立即停止动画并淡入相关图像。

有任何想法吗？

4

1 回答 1

0

您的方法看起来有点奇怪，无论如何要立即停止所有当前动画，您需要调用.stop()动画元素的方法。您应该传入两个参数，都设置为true指示 (clearQueue && jumpToEnd);

function stopBanner() {
     clearInterval(startLoop);
     $('##image1, ##image2, ##image3').stop(true, true);
}

同样，您应该重新考虑您的代码。例如，在这里缓存 DOM refs 是一件非常重要的事情。

参考：.stop()

于 2011-01-21T10:52:34.697 回答