0

I have wrote this simple code to make a basic slideshow for my website. This code works fine for a while but after that it starts malfunctioning, I mean the image don't load appropriately, the same image suddenly pops ups and fades and then slowly appears back again. I though something could be wrong withe the SetTimeOut timing, but I've played with it a alot and it didn't solve my problem: 

    var x = 1;
    function F() {
        $('#Left').html("<img src='Images/" + x + ".jpg' />").fadeOut(0).fadeIn(1000).delay(5000).fadeOut(1000);
        if (x < 3) { x++;}
        else { x = 1; }
        setTimeout("F()", 7000);
    }

My question is what could be wrong with the simple code and how could I fix it or improve it.

4

1 回答 1

1

我认为您可能对淡入淡出操作不完全花费 7 秒有问题，但是您的超时被安排为 7 秒，所以随着时间的推移，两者没有正确排列。您可以通过在完成功能完成最后一次淡入淡出时启动下一个动画来使它们完美排列而不会累积错误。

   var x = 1;
   function F() {
        $('#Left').html("<img src='Images/" + x + ".jpg' />")
            .fadeOut(0)
            .fadeIn(1000)
            .delay(5000)
            .fadeOut(1000, F);
        if (x < 3) { x++;}
        else { x = 1; }
    }
于 2013-09-07T17:53:28.850 回答