Простое слайдшоу фотографий jquery - PullRequest
Новая
       0

Простое слайдшоу фотографий jquery

3 голосов
/ 16 февраля 2011

Я хотел написать свой собственный скрипт слайд-шоу, но в результате он сразу же переходит к изображению 6 и сильно мигает ... HTML это просто страница с изображением id = "ss1". 

var i = 1;

$(document).ready(function(){
    slideShow();
});
var t;
function runSlideShow() {
    if(i >= 7) i = 1;
    $("#ss1").fadeTo("slow",0);
    document.getElementById('ss1').src = "img/" + i + ".jpg";
    $("#ss1").fadeTo("slow",1);
    i += 1;
    t = setTimeout(slideShow(), 5000);  
}

1 Ответ

5 голосов
/ 16 февраля 2011

Мне кажется, проблема в том, что вы используете 

t = setTimeout(slideShow(), 5000);

slideShow () немедленно выполняет функцию slideShow ().Попробуйте заменить его на: 

t = setTimeout('slideShow()', 5000);

.Имейте в виду, что здесь используется eval, который считается небезопасным (но не в этом случае) и медленным.

Fade не работает, потому что Fade работает асинхронно в вашем коде, что означает, что оно затухает, пока онозатухание в одно и то же время (что делает некоторые странные ситуации очевидными).

function runSlideShow() {
    if(i >= 7) i = 1;
    $("#ss1").fadeTo("slow",0, function() {
        document.getElementById('ss1').src = "img/" + i + ".jpg";
        $("#ss1").fadeTo("slow",1, function() {
            i += 1;
            t = setTimeout('slideShow()', 5000);
        });
    });  
}

должно работать.Поскольку код между функцией () {} теперь будет выполняться после завершения затухания.

...