0

我正在尝试使用 Jquery 制作图像旋转器，但是当我将鼠标放在图像上时我的旋转器不会停止，所以我猜测 clearTimeout 有问题。
这是我的代码：

$(document).ready(function () {
    var o = 0
    var t = null;
    stop = false;
    $("img:gt(0)").hide();
    broj = ($("img").size());

    function promena() {
        o++;
        if (o == broj) {
            o = 0;
            $("img:lt(3)").hide(function () {
                $("img").eq(3).delay(1000).fadeOut(1000);
            });
        }
        $("img").eq(o).delay(1000).fadeIn(1000, function () {
            t = setTimeout(promena, 1000);
        });
    };

    t = setTimeout(promena, 1000);
    $("div img").mouseover(function () {
        clearTimeout(t);
    });
});

这是HTML：

<html>
<head>
<title>M</title>
</head>
<body>
 <div>
 <img src="images/1.jpg"    />
 <img src="images/2.jpg"    />
 <img src="images/3.jpg"    />
 <img src="images/4.jpg"    />
 </div>
</body>
</html>

如果这意味着什么，我所有的图像都用 img{position:absolute} 绝对定位

4

1 回答 1

1

您的代码本质上是这样做的：

  1. 超时定时器运行一秒
  2. 延迟运行一秒
  3. 淡入淡出运行一秒钟
  4. 重复

--> 如果您触发 mouseover 事件，并因此在 (1) 以外的任何时间调用 clearTimeout，则您不会清除任何正在运行的计时器。

换句话说，如果你在 1.5 秒之后执行此操作，延迟仍在运行，然后是淡入淡出，然后你再次调用 setTimeout - 所以你试图在调用 setTimeout 之前清除Timeout。

您可能应该调用 .stop() 来停止延迟和淡入淡出队列，并在它们完成时阻止 setTimeout 运行。

于 2011-03-28T19:33:01.803 回答