新增：产品自动5s轮播

LuoXi-Project · Dec 17, 2024 · 576aa0c · 576aa0c
1 parent 0dad1dd
commit 576aa0c
Showing 1 changed file with 11 additions and 5 deletions.
diff --git a/js/index.js b/js/index.js
@@ -1,14 +1,20 @@
 var swiper = new Swiper(".swiper", {
-    loop: true,
-    speed: 1200,
-    effect: "fade",
+    loop: true,  // 循环模式
+    speed: 1200,  // 动画速度
+    effect: "fade",  // 切换效果为淡入淡出
 
     navigation: {
-        nextEl: ".swiper-button-next",
-        prevEl: ".swiper-button-prev",
+        nextEl: ".swiper-button-next",  // 下一页按钮
+        prevEl: ".swiper-button-prev",  // 上一页按钮
+    },
+
+    autoplay: {
+        delay: 5000,  // 每隔5秒自动切换
+        disableOnInteraction: false,  // 允许用户互动后依然保持自动播放
     },
 });
 
+
 let animation = anime({
     targets: "header",
     translateY: [-80, 0],