jQuery, вызванный с setInterval, не анимируется на первом интервале - PullRequest
Новая
       21

jQuery, вызванный с setInterval, не анимируется на первом интервале

0 голосов
/ 13 марта 2012

У меня есть два сложенных изображения. С setInterval () верхняя часть исчезает, выставляя вторую. Затем верхнее изображение переключается на нижний src, пока оно невидимо, и снова становится непрозрачным. Второе изображение изменяется на следующее изображение и ждет, пока setInterval () исчезнет с верхнего изображения и сделает это снова.

Все отлично работает, кроме первого раза; Там нет исчезать. Что я не вижу?

Это происходит на всех Firefox и Chrome, и я предполагаю, что все остальные.

HTML 

    <script type="text/javascript">
    setInterval('swapImage()', 5000);
    var galleryCount = 3;   
    </script>

    ...

    <img id="image" src="images/gallery/01.jpg" />
    <img id="imagenext" src="images/gallery/02.jpg" />

1010 * Javascript * 

function swapImage(imageToFadeID)
{
    $("#image").animate
    (
        { "opacity": "0" },
        "slow",
        "linear",
        changeImage()
    );
};

var i = 1;

function changeImage()
//counter +1
{
i = i + 1;
//add "0" to image number "j" if less than 10.
if (i < 10)
    {
    var j = "0" + i;
    }
else
    {
    j = i;
    }
//change top image to match bottom
var topImage = document.getElementById("imagenext").src;
document.getElementById("image").src = topImage;
//make top image reappear
document.getElementById("image").style.opacity = '1';
//change out bottom image to next
var btmImage = "images/gallery/" + j + ".jpg";
document.getElementById("imagenext").src = btmImage;
//reset counter if at end
if (i > galleryCount - 1)
    {
    i = 0;
    }

}

1 Ответ

1 голос
/ 13 марта 2012

Похоже, вы вызываете changeImage вместо передачи его в качестве обратного вызова на animate:

Неправильно: 

function swapImage(imageToFadeID)
{
    $("#image").animate
    (
        { "opacity": "0" },
        "slow",
        "linear",
        changeImage()   // <--- !!! Remove the parentheses from this line!
    );
};

Справа: 

function swapImage(imageToFadeID)
{
    $("#image").animate
    (
        { "opacity": "0" },
        "slow",
        "linear",
        changeImage
    );
};
...