Home/ Questions/Q 4233464
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-21T02:13:26+00:00

I’m trying to make image rotator with Jquery, but my rotator won’t stop when

  • 0

I’m trying to make image rotator with Jquery, but my rotator won’t stop when I put the mouse over the images, so I’m guessing that something’s wrong with clearTimeout.
Here’s my code: 

$(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);
    });
});

And here’s 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>

If it means anything, all of my images are positioned absolutely with img{position:absolute}

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Your code is essentially doing this:

    1. timeout timer running for one second
    2. delay running for one second
    3. fade running for one second
    4. repeat

    –> if you trigger the mouseover event, and hence call clearTimeout at any point other than (1), you aren’t clearing any running timer.

    In other words, if you do this after, lets say 1.5 seconds, the delay is still running, then the fade, and then you call setTimeout again – so you are attempting to clearTimeout before calling setTimeout.

    You should probably call .stop() to stop the delay and fade queue, and prevent setTimeout running when they are complete.

    • 0