时间戳

首页 > 解决方案 > Fancybox + swiper

jquery - Fancybox + swiper

问题描述

再会！

有一个滑动滑块，当您单击幻灯片时，会打开一个花式框。滑块用于循环模式。fancybox 网站有一些代码可以避免显示重复的幻灯片。从示例来看，它适用于光滑的滑块，但滑动器存在问题。

当 fancybox 打开时，它只显示标记中的幻灯片。也就是说，它不会显示重复的幻灯片。看起来不错，但也有问题。fancybox-content 被分配了 swiper-slide 类。并且滑块本身中的 swiper-slide-duplicate 设置为 display: none 样式。滑块本身坏了。可能是什么问题呢？请帮帮我。

     $().fancybox({
        selector: '.product-detail__slide:not(.swiper-slide-duplicate)',
        backFocus: false,
        loop: true,
        observer: true,
        observeParents: true,
        buttons: [
            "close"
        ]
    });
    $(document).on('click', 'product-detail__slide.swiper-slide-duplicate', function (e) {
        var $slides = $('.product-detail__slide .swiper-slide:not(.swiper-slide-duplicate)');
        $slides
            .eq(($(this).attr("data-swiper-slide-index") || 0) % $slides.length)
            .trigger("click.fb-start", { $trigger: $(this) });
        return false;
    });

标签： jqueryfancyboxswiper

解决方案

推荐阅读