fix(core): animate preloader in visible slides if watchSlidesProgress…

… is enabled
nolimits4web · Apr 24, 2022 · 8174b5a · 8174b5a
1 parent de47f09
commit 8174b5a
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 3 deletions.
diff --git a/src/core/classes/addClasses.js b/src/core/classes/addClasses.js
@@ -31,6 +31,7 @@ export default function addClasses() {
     { 'ios': device.ios },
     { 'css-mode': params.cssMode },
     { 'centered': params.cssMode && params.centeredSlides },
+    { 'watch-progress': params.watchSlidesProgress },
   ], params.containerModifierClass);
   classNames.push(...suffixes);
   $el.addClass([...classNames].join(' '));

diff --git a/src/modules/lazy/lazy.less b/src/modules/lazy/lazy.less
@@ -18,9 +18,13 @@
   border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
   border-radius: 50%;
   border-top-color: transparent;
-  animation: swiper-preloader-spin 1s infinite linear;
 }
-
+.swiper:not(.swiper-watch-progress),
+.swiper-watch-progress .swiper-slide-visible {
+  .swiper-lazy-preloader {
+    animation: swiper-preloader-spin 1s infinite linear;
+  }
+}
 .swiper-lazy-preloader-white {
   --swiper-preloader-color: #fff;
 }

diff --git a/src/modules/lazy/lazy.scss b/src/modules/lazy/lazy.scss
@@ -20,7 +20,12 @@
   border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
   border-radius: 50%;
   border-top-color: transparent;
-  animation: swiper-preloader-spin 1s infinite linear;
+}
+.swiper:not(.swiper-watch-progress),
+.swiper-watch-progress .swiper-slide-visible {
+  .swiper-lazy-preloader {
+    animation: swiper-preloader-spin 1s infinite linear;
+  }
 }
 
 .swiper-lazy-preloader-white {