Слайд-шоу изображений при загрузке не работает должным образом - PullRequest
Новая
       6

Слайд-шоу изображений при загрузке не работает должным образом

0 голосов
/ 12 декабря 2018

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

Итак, вопрос:

Я работаю над проектом сайта кинотеатра.Я добавил несколько фотографий в виде слайд-шоу на своей домашней странице, но по какой-то причине слайд-шоу не работает должным образом.В нем есть некоторый сбой: например, иногда порядок неправильный, а иногда все картинки пытаются появиться за один раз или меняются очень быстро и т. Д.

Я догадался, что это может быть как-то, когда я перезагружаю сайт, предыдущийonlaod также продолжает работать, так что, похоже, идут 2 слайд-шоу или что-то в этом роде, так что из других решений, я думаю, мне нужно где-то поместить onload = null, но я точно не могу понять.

Любая помощь будет очень признательна.

Это мой HTML-код для слайд-шоу: 

<div class="bg-movies" style="top: 65%;">
    <img src='images/slideshow/war.jpg' width='1000' height='300' 
    onload="setSlide();"/>
</div>

А это мой код JavaScript: 

<script language='javascript'>
    <!--
        var toprated=new Array('sarkar.jpg','hajwala.jpg','96.jpg','war.jpg');
        var pos=0,x;
        document.images[1].src='images/slideshow/'+toprated[0];

        function setSlide(){
            x=setInterval('chgPic()',2000);
        }

        function chgPic(){
                pos=(++pos)%toprated.length;
                document.images[1].src="images/slideshow/"+toprated[pos];
        }
    -->
</script>

1 Ответ

0 голосов
/ 12 декабря 2018

Ваша проблема в рекурсии.Вы вызываете метод setSlide() после загрузки изображения.Это установит интервал для вызова chgPic(), но когда вызывается метод chgPic() и обновляется src изображения, событие onload в теге img будет выполнено снова (так как изображение былозагружен).Поэтому setSlide() будет вызван снова, что установит другой интервал для вызова метода chgPic().И так далее, и т.д. Я удивлен, что ваш браузер не сломался.

Что вам нужно сделать, это установить интервал (т. Е. Вызвать метод setSlide()) после загрузки страницы, или даже лучшетем не менее, используйте готовый документ jQuery, если вы используете jQuery: 

$( document ).ready(function() 
{
}

и вызовите здесь свой метод setSlide().

Хотя я бы не советовал делать это так, как вы.Вы можете использовать несколько простых jQuery и CSS, чтобы заставить это работать.Взгляните на эту ссылку.

...