javascript - swiper.js multiple imgs per slide lazy loading not working -
thanks reading, try use swiper.js , works fine lazy loading demo, in demo, there 1 image per slide, want represent 4 imgs per slide, turns out first img in each slide show up.
<div class="swiper-container"> <div class="swiper-wrapper"> <div class="swiper-slide"> <!-- required swiper-lazy class , 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>
so, trying read jquery code in swiper.js, , due ability, can not figure out, tbh, can not understand.
any help?
i got it.
as long using same src ones in slides after, lazy loaded too. after replacing data-srcs diff ones, works.
thank, swiper.js
Comments
Post a Comment