自动播放(幻灯片)在庄重的灯箱灯箱画廊?(Autoplay (slideshow) a lightb

2019-10-18 03:46发布

我一直在寻找一个负责任的灯箱,将自动播放开始在画廊指定点画廊。 庄重的弹出窗口看起来非常稳固。 任何人有办法让它为灯箱幻灯片行动 - 即,具有画廊autoadvance?

从长相Magnific酒店文档一样应该有一种方式,利用了magnificPopup.next();magnificPopup.updateItemHTML(); 和/或回调事件,但这已经超出了我的JavaScript编程

谢谢!

编辑:如果你想“嗯的fancybox的将autoPlay?”当然,这也会工作。 我还是想尝试Magnific酒店

Answer 1:

简而言之间隔open回调。

callbacks: {
    open: {
       setInterval(function() {
            $.magnificPopup.instance.next();
       }, 2000);
   }
}

当然,这是很基本的实现,但你可能就需要走。



Answer 2:

我想通了一点修修补补虽然有一个怪癖之后。 我在页面上magnificPopup的两个实例。 一位名为只元素,而不是在画廊模式之一,在启用的数组和画廊的所有项目。 此代码是在两个版本。 然而,它的影响这两种情况下,我的“非”画廊刷新每5秒! 无论如何,下面的代码是你在找什么:

 callbacks: {
    open: setInterval(function() {
             $.magnificPopup.instance.next()
                }, 5000)}


Answer 3:

我的弹出Magnific酒店幻灯片使用小形状与“开始幻灯片放映”按钮和用于所希望的时间间隔的输入。 幻灯片放映对象具有基本上与下面的代码:

var slideshow = {
    interval: 4,
    intervalTimer: null,
    currImgNo: 0,
    insertController: function(parentElement) {
        // DOM code to create form html
        $(slideShowStartButton).on('click', function(e){
            $('.popup-parent-container').magnificPopup('open', slideshow.currImgNo);
            if ($.magnificPopup.instance.index + 1
                    < $.magnificPopup.instance.items.length) {
                $.magnificPopup.instance.next();
                slideshow.currImgNo++;
            } else {
                $('.popup-parent-container').magnificPopup('close');
            }
        }, slideshow.interval * 1000);
    });
}

$(document).ready(function() {
    slideshow.insertController(/* This code depends on the slide show controller html */);
});

幻灯片放映属性currImgNo用于与去年popuped图像进入幻灯片并防止循环。

庄重的弹出得到了在打开和关闭事件处理多余的线条:

$('.popup-parent-container').magnificPopup({
    // ...
    callbacks: {
        open: function() {
            slideshow.currImgNo = this.index;
        },
        close: function() {
            if (slideshow.intervalTimer) {
                clearInterval(slideshow.intervalTimer);
            }
        }
    }
});

这工作得很好,至少对某些WebKit和我测试Gecko浏览的。

我的版本还推出全屏模式,但需要更多的代码跨浏览器兼容。



文章来源: Autoplay (slideshow) a lightbox gallery in magnific lightbox?