Wordpress SwiperJS-加载时在图像之间显示微调器

Wordpress SwiperJS-加载时在图像之间显示微调器,wordpress,lazy-loading,swiperjs,swiper.js,Wordpress,Lazy Loading,Swiperjs,Swiper.js,我在自定义构建Wordpress网站的一些图库中使用SwiperJS。我还使用一个插件延迟加载我的所有图像,因此SwiperJS自己的延迟加载被禁用。但是,现在当图像被滑动和加载时,没有任何微调器指示正在发生什么。问题是,我如何用javascript添加这个微调器 假设DOM中呈现了以下内容: <div class="swiper-container"> <div class="swiper-wrapper&q

我在自定义构建Wordpress网站的一些图库中使用SwiperJS。我还使用一个插件延迟加载我的所有图像,因此SwiperJS自己的延迟加载被禁用。但是,现在当图像被滑动和加载时,没有任何微调器指示正在发生什么。问题是,我如何用javascript添加这个微调器

假设DOM中呈现了以下内容:

       <div class="swiper-container">
            <div class="swiper-wrapper">
                                           
                        <div class="swiper-slide swiper-slide-active" data-swiper-slide-index="1" role="group" aria-label="3 / 7" style="width: 624px;">
                            <img src="path/to/src.jog" alt="" class="lazyloaded" data-ll-status="loaded">
                        </div>

                        <div class="swiper-slide swiper-slide-next" data-swiper-slide-index="2" role="group" aria-label="4 / 7" style="width: 624px;">
                            <img src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%200%200'%3E%3C/svg%3E" alt="" data-lazy-src="//localhost:3000/wp-content/uploads/2021/04/K0924-900x1200.jpg">
                        </div>

             </div>
      </div>

当前显示的幻灯片中,class
class=“swiper Slide active”
,下一张幻灯片中有
class=“swiper Slide next”

当我刷卡(或按下下一个箭头)时,class
class=“swiper slide next”
变为
class=“swiper slide active”
及其子项,img标记接收class
class=“lazyloading”
data ll status=“loading”

加载图像后,图像将变为
class=“lazyload”data ll status=“loaded”

现在,我如何用javascript跟踪当类
class=“swiper slide active”
的div中的img标记接收类
class=“lazyloading”或
data ll status=“loading”
时,在
内部呈现一个微调器,以及
class=“lazyloading”时
更改为
class=“lazyload”
卸下微调器

我将非常感谢任何帮助!谢谢大家!