javascript баннеров зависает на первом баннере - PullRequest
Новая
       21

javascript баннеров зависает на первом баннере

0 голосов
/ 17 января 2020

У меня есть два баннера, которые я недавно добавил на свой сайт, и я хотел бы менять баннеры каждые 5 секунд, к сожалению, он показывает только первый и зависает

это весь мой код для foreach данные 

var links = ["http://site", "http://site"];
var images = ["/uploads/ad1.png", "/uploads/ad2.png"];
var i = 0;
var renew = setInterval(function() {
  if (links.length == i) {
    i = 0;
  } else {
    document.getElementById("bannerImage").src = images[i];
    document.getElementById("bannerLink").href = links[i];
    i++;

  }
}, 500);
   

<?php  foreach ($messages as $message){

    ?>

                 

                    <a href="?id= <?php echo $message['message_id']?>" class="waves-effect waves-light"> details <i class="fas fa-angle-double-left ml-2"></i>

                </div>

                <br>

            </div>

        </div>
        <div class="container">
            <div class="text-center">

                <a id="bannerLink" href="http://site" onclick="void window.open(this.href); return false;">
                    <img id="bannerImage" src="https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__340.jpg" width="320" height="120" alt="some text">
                </a>
            </div>
        </div>



    </div>

1 Ответ

1 голос
/ 18 января 2020

Этот код изменяет изображение и ссылку каждые 5 секунд. 

var links = ["http://site","http://site"];
var images = ["https://images.pexels.com/photos/414612/pexels-photo-414612.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500","https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__340.jpg"];

var i = 0;
var renew = setInterval(function(){    
    document.getElementById("bannerImage").src = images[i];
    document.getElementById("bannerLink").href = links[i];
    i++;
    
    if (i == links.length) {
      i = 0;
    }
}, 5000);
<div class="container">
    <div class="text-center">

        <a id="bannerLink" href="http://site" onclick="void window.open(this.href); return false;">
            <img id="bannerImage" src="https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__340.jpg" width="320" height="120" alt="some text">
        </a>
    </div>
</div>

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

Я также изменил 500 на 5000 (это в миллисекундах)

...