swiper.js 每张幻灯片多张图片延迟加载不起作用

Question

感谢阅读，我尝试使用 swiper.js 并且它在延迟加载演示中运行良好，但在演示中，每张幻灯片只有一张图片，但我想每张幻灯片表示 4 个 img , 结果只有每张幻灯片中的第一个 img 会出现。

<div class="swiper-container">
    <div class="swiper-wrapper">
        <div class="swiper-slide">
            <!-- Required swiper-lazy class and image source specified in data-src attribute -->
            <img data-src="1.jpg" class="swiper-lazy">
            <img data-src="2.jpg" class="swiper-lazy">
            <img data-src="3.jpg" class="swiper-lazy">
            <img data-src="4.jpg" class="swiper-lazy">
            <img data-src="5.jpg" class="swiper-lazy">
            <!-- Preloader image -->
            <div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>
        </div>
        <div class="swiper-slide">
            <img data-src="2.jpg" class="swiper-lazy">
            <div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>
        </div>
        <div class="swiper-slide">
            <img data-src="3.jpg" class="swiper-lazy">
            <div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>
        </div>
        <div class="swiper-slide">
            <img data-src="4.jpg" class="swiper-lazy">
            <div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>
        </div>
    </div>
</div>

所以，我正在尝试阅读swiper.js中的jquery代码，但由于我的能力，我无法理解，说实话，我无法理解。

有什么帮助吗？

Answer 1

我知道了。

只要我使用与后面幻灯片中相同的 src，它也是延迟加载的。用不同的替换所有数据源后，它工作了。

谢谢，swiper.js

swiper.js 每张幻灯片多张图片延迟加载不起作用

swiper.js multiple imgs per slide lazy loading not working

javascript

jquery

swiper