Jquery: небольшое слайд-шоу, как создать переменную для следующего слайда, которая будет постепенно исчезать, и проблема с setInterval - PullRequest
Новая
       8

Jquery: небольшое слайд-шоу, как создать переменную для следующего слайда, которая будет постепенно исчезать, и проблема с setInterval

0 голосов
/ 25 июня 2011

http://jsfiddle.net/nicktheandroid/B7Rhe/5/

Я пытаюсь сделать так, чтобы следующий слайд постепенно исчезал поверх текущего слайда, вместо того, чтобы затемнять все слайды перед тем, как переходить к следующему. Я не могу понять.

также обратите внимание на то, что я прокомментировал. Я попытался сделать это функцией, затем вызвал setInterval для функции, но она не работала, поэтому я просто установилInInval вокруг самой функции, вместо вызова функции внутри setinterval.

любая помощь или рекомендация очень ценится. 

var x = 2;
console.log('Not broken');

setInterval(function() {
// function slideshow() {
    var m = $('.slideshow li').size();
    x += 1;
    if (x > m) {
        x = 1;
    }
    $(".slideshow ul li:nth-child(" + (x) + ")").animate({
        opacity: 1
    });
    $(".slideshow ul li:nth-child(n)").animate({
        opacity: 0
    });
    $(".slideshow ul li:nth-child(" + (x) + ")").animate({
        opacity: 1
    });
// }
}, 2000);

//setInterval("slideshow()", 1000);

1 Ответ

1 голос
/ 25 июня 2011

Ваша проблема заключается в следующем: 

$(".slideshow ul li:nth-child(n)")

:nth-child(n) просто совпадает со всем, передача n - это то же самое, что вообще не включать этот селектор. Таким образом, проблема в том, что вы затухаете ВСЕ из своих элементов, а затем снова добавляете один обратно. Вам нужно только затушевать видимый. Измените это на это: 

$(".slideshow ul li:visible")

Еще одно незначительное изменение. При первоначальной загрузке у вас отображаются все изображения, поэтому все они будут скрыты. Вы должны скрыть все, кроме видимого при загрузке, чтобы он работал в первом цикле.

...