Я хочу добавить задержку между тегами изображения.Как я могу сделать? - PullRequest
0 голосов
/ 30 ноября 2018

Мой проект: jsFiddle

setTimeout(function() {


for (var i = 0; i < 15; i++) {


    $('.rastgele').append('<img class="g59" src="https://cdn.intgrl.co/G59/static/images/window.png">');


}



$('.g59').each(function(index) {

    $(this).css({
        left: ((Math.random() * $('body').width())),
        top: ((Math.random() * $('body').height())),

    });

});


/*$('.g59').delay(5000).queue(function(next) {
    $(this).show();
    next();
});*/

}, 2000);

Но это не работает.Я хочу, чтобы https://g59records.com/ Я хотел половину секунды между каждым тегом img.Я добавил задержку, я использовал setTimeout или setInterval, но у меня это не работает.Что я могу сделать, ребята?Пожалуйста, помогите мне.Извините за мой плохой английский.

Ответы [ 3 ]

0 голосов
/ 30 ноября 2018

вместо setTimeout вам нужно использовать setInterval, чтобы вызывать его снова и снова.

var imagesOnWindow=20;
var i=1;
var start
start = setInterval(function() {
        var left=((Math.random() * $('body').width()));
        var top=((Math.random() * $('body').height()));
        var _img=$("<img/>",{
            class:"g59",
            src:"https://cdn.intgrl.co/G59/static/images/window.png",
        });
        $(_img).css('top', top);
        $(_img).css('left', left);
        console.log(_img);
        $('.rastgele').append(_img);
        i++;
        if(i>imagesOnWindow)
          clearInterval(start);
        }, 1000);

вы можете увидеть рабочий пример здесь

0 голосов
/ 30 ноября 2018

Попробуйте использовать это:

    for (var i = 0; i < 15; i++) {
        (
         function(i) {setTimeout(function() {
            var left = Math.random() * $('body').width();
            var top = Math.random() * $('body').height();
            $('.rastgele').append('<img class="g59" style="left:'+left+'px;top:'+top+'px;" src="https://cdn.intgrl.co/G59/static/images/window.png">');

          }, 500*i)
   })(i);  

}
0 голосов
/ 30 ноября 2018

Нет необходимости в цикле for, вы можете сделать это с установленным интервалом и интервалом остановки, когда счетчик достигнет 15.

var counter = 0;
var intervalId = setInterval(function() {

    if (counter > 15) {
        clearInterval(intervalId);
        return false;
    }

    var img = document.createElement("img");
    img.src = "https://cdn.intgrl.co/G59/static/images/window.png";
    img.className = "g59";
    $('.rastgele').append(img);
    $(img).css({
        left: ((Math.random() * $('body').width())),
        top: ((Math.random() * $('body').height())),

    });
    counter++;

}, 500);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="rastgele"></div>
...