swiper js

anshxika · Nov 14, 2024 · fe88a22 · fe88a22
1 parent 20d98bc
commit fe88a22
Showing 1 changed file with 23 additions and 17 deletions.
diff --git a/js files/script.js b/js files/script.js
@@ -1,19 +1,25 @@
-const leftArrow = document.querySelector('.left-arrow');
-const rightArrow = document.querySelector('.right-arrow');
-const cardsWrapper = document.querySelector('.cards-wrapper');
-
-leftArrow.addEventListener('click', () => {
-    cardsWrapper.scrollBy({
-        top: 0,
-        left: -200,
-        behavior: 'smooth'
-    });
-});
-
-rightArrow.addEventListener('click', () => {
-    cardsWrapper.scrollBy({
-        top: 0,
-        left: 200,
-        behavior: 'smooth'
+document.addEventListener("DOMContentLoaded", function () {
+    var swiper = new Swiper(".mySwiper", {
+        slidesPerView: 1,
+        spaceBetween: 20,
+        loop: true,
+        navigation: {
+            nextEl: ".swiper-button-next",
+            prevEl: ".swiper-button-prev",
+        },
+        breakpoints: {
+            640: {
+                slidesPerView: 2,
+                spaceBetween: 20,
+            },
+            768: {
+                slidesPerView: 2,
+                spaceBetween: 30,
+            },
+            1024: {
+                slidesPerView: 2,
+                spaceBetween: 40,
+            },
+        },
     });
 });