小编Mad*_*nse的帖子

与滑块同步的华丽弹出窗口

只是想知道是否可以将 Magnific pop-up 与滑块(例如 flexslider 或 slick)同步,以便当您更改 Magnific pop-up 上的幻灯片时,背景中的滑块也会发生变化。

编辑

$('.slick-slider').magnificPopup({
    delegate: '.slides:not(.slick-cloned) a',
    type: 'image',
    mainClass: 'mfp-fade',
    fixedContentPos: false,
    removalDelay: 350,
    pauseOnHover: false,
    gallery:{
        enabled: true,
        tCounter: '<span class="mfp-counter">%curr% of %total%</span>'
    },
    callbacks: {
        beforeClose: function() {
            $('.slick-slider').slick('slickGoTo', parseInt(this.index - 1));

           // works better with the code bellow but sometimes gets stuck between 2 slides 
           $('.slick-slider').slick('slickGoTo', parseInt(this.index));

        }
    }
});
Run Code Online (Sandbox Code Playgroud)

flexslider magnific-popup slick.js

3
推荐指数
1
解决办法
8148
查看次数

标签 统计

flexslider ×1

magnific-popup ×1

slick.js ×1