0

My images are absolute positioned horizontally and should move right to end after each interval.

When the first image reaches the last images place they should come back left to the beginning position.

My code does this but it keeps on moving the images left to thousands of px.
After that they start moving right again.

Why is that?

$(document).ready(function() {
    //alert("Ok");
    var w = 0;
    $('ul>li').each(function(i, o) {
        $(this).css({
            "position": "absolute",
            "left": 5 + w + 'px'
        })`enter code here`
        w = w + 210;
    });

    var lastPos = parseInt($("ul>li:last").css("left"));
    //alert(lastPos);
    var I = 0;
    setInterval(function() {
        I = parseInt($("ul>li:first-child").css("left"));
        //$("#i1").text(I);
        $("ul>li").animate({
            left: "+=210px"
        }, 500, function() {
            I = parseInt($("ul>li:first-child").css("left"));
            $("#i2").text(I);
            $("#i4").text(I > lastPos)
            if (I > lastPos) { //here comes the problem
                $("ul>li").animate({
                    left: "-=" + lastPos
                }, 500, function() {
                    I = parseInt($("ul>li:first-child").css("left"));
                    $("#i3").text(I);
                });
            }
        });
    }, 4000);
})
Nope
  • 22,147
  • 7
  • 47
  • 72
tanvirgeek
  • 153
  • 1
  • 2
  • 10
  • If multiple elements are animated, the callback is executed once per matched element, not once for the animation as a whole. GOT the problem... – tanvirgeek Dec 18 '12 at 18:48
  • solution-> http://stackoverflow.com/questions/8793246/jquery-animate-multiple-elements-but-only-fire-callback-once – tanvirgeek Dec 18 '12 at 19:37

0 Answers0