великолепное всплывающее слайд-шоу с автоматическим воспроизведением

Я использую всплывающее окно Magnific для слайд-шоу всплывающих изображений. Ниже то, что я сделал.

$('.parent-container').magnificPopup({
    type:'image',
    delegate: 'a',
    gallery: {
// options for gallery
    enabled: true
},
    image: {
// options for image content type
    titleSrc: 'title'
}
});

А это моя разметка HTML

<div class="parent-container">
<ul class="row carousel-inner" style="margin:0; padding:0; background:red;">
    <li class="active item gallery-photo" style="margin:0; padding:0; background:red;">
        <a href="images/gallery-1.jpg" title="Image Title Here"><img class="img-responsive" src="images/gallery-1.jpg"></a>
    </li>
    <li class="item">
        <a href="images/gallery-2.jpg" title="Image Title Here"><img class="img-responsive" src="images/gallery-2.jpg"></a>
    </li>
    <li class="item">
        <a href="images/gallery-3.jpg" title="Image Title Here"><img class="img-responsive" src="images/gallery-3.jpg"></a>
    </li>
</ul>
</div>

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

Ваши усилия будут высоко оценены.


popup autoplay magnific-popup
person Soeb Safi    schedule 08.07.2015    source источник

Ответы (1)


arrow_upward
2
arrow_downward

Я нашел это, я добавляю это как ответ, чтобы кто-то еще мог извлечь из этого пользу. Вам просто нужно добавить обратные вызовы. Я добавил код ниже после функции magnificPopup({}). И это решит проблему: изображения начнут двигаться автоматически.

callbacks: {
open: {
   setInterval(function() {
        $.magnificPopup.instance.next();
   }, 2000);
}
}
person Soeb Safi    schedule 08.07.2015