45 lines
1.4 KiB
HTML
45 lines
1.4 KiB
HTML
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css" />
|
|
<script src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>
|
|
|
|
<script>
|
|
|
|
function initHomepageBannerSlider() {
|
|
if (typeof Swiper === "undefined") return
|
|
if (!document.querySelector(".homepage-banner-slider")) return
|
|
|
|
new Swiper(".homepage-banner-slider", {
|
|
loop: true,
|
|
autoplay: {
|
|
delay: 3500,
|
|
disableOnInteraction: false,
|
|
},
|
|
pagination: {
|
|
el: ".homepage-banner-pagination",
|
|
clickable: true,
|
|
},
|
|
})
|
|
}
|
|
|
|
function initProductCategorySliders() {
|
|
if (typeof Swiper === "undefined") return
|
|
document.querySelectorAll(".product-category-slider").forEach(function (el) {
|
|
new Swiper(el, {
|
|
slidesPerView: 5,
|
|
spaceBetween: 12,
|
|
navigation: {
|
|
nextEl: el.querySelector(".swiper-button-next"),
|
|
prevEl: el.querySelector(".swiper-button-prev"),
|
|
},
|
|
breakpoints: {
|
|
1280: { slidesPerView: 4 },
|
|
1600: { slidesPerView: 5 },
|
|
},
|
|
})
|
|
})
|
|
}
|
|
|
|
document.addEventListener("DOMContentLoaded", () => {
|
|
initHomepageBannerSlider()
|
|
initProductCategorySliders()
|
|
})
|
|
</script> |