Создание петли с непрозрачностью и элементами li

Question

У меня есть этот код JavaScript

// Elke keer een logo meer opacity geven
    var randomnumber=Math.floor(Math.random()*$("#main .logolint ul li").children().length);
    $(function() {
        // geef de logo's een opacity van 0.5
        $("#main .logolint ul li > img").css({opacity: 0.5});

        //set timeout for image to appear (set at 500ms)
        setTimeout(function(){
           //fade in the random index of the image collection
           $("#main .logolint ul li > img:eq(" + randomnumber + ")").css({opacity: 1.0});
        }, 500);       
    });

Этот код дает моему списку непрозрачность от 0,5. И дать случайному элементу списка непрозрачность для 1.0.

Но как мне сделать этот скрипт? Это он дает более 5 сек. Еще один элемент li с прозрачностью от 1? Как сделать цикл в этом сценарии?

Answer 1

Измените setTimeout на setInterval, тот же код, просто другое имя функции. setInterval вызывает функцию через заданный интервал (таким образом, цикл).

Возможно, вы также захотите изменить вызов opacity на fadeIn, тогда вы получите хороший эффект затухания вместо внезапного изменения с 0,5 на 1.

Также вы можете сохранить setInterval «указатель»:

var pntr = setInterval(xxx);

Так что, когда ваш цикл завершен (и все видно), вы можете вызвать 'clearInterval (pntr) `, чтобы остановить интервал.