123 lines
2.5 KiB
JavaScript
123 lines
2.5 KiB
JavaScript
// HOMEAPGE FUNC
|
|
function homepageHandler() {
|
|
swiperSectionHero();
|
|
swiperSectionBrand();
|
|
swiperDealList();
|
|
}
|
|
|
|
homepageHandler();
|
|
|
|
// SWIPER SECTION HERO
|
|
function swiperSectionHero() {
|
|
new Swiper(".swiper-section-hero", {
|
|
spaceBetween: 12,
|
|
rewind: true,
|
|
speed: 1000,
|
|
autoplay: {
|
|
delay: 2500,
|
|
disableOnInteraction: false,
|
|
pauseOnMouseEnter: "true",
|
|
},
|
|
pagination: {
|
|
el: ".swiper-pagination",
|
|
clickable: true,
|
|
},
|
|
});
|
|
}
|
|
|
|
function swiperSectionBrand() {
|
|
new Swiper(".swiper-section-banner", {
|
|
spaceBetween: 20,
|
|
slidesPerView: 6,
|
|
rewind: true,
|
|
speed: 1000,
|
|
autoplay: {
|
|
delay: 2500,
|
|
disableOnInteraction: false,
|
|
pauseOnMouseEnter: "true",
|
|
},
|
|
});
|
|
}
|
|
|
|
function swiperDealList() {
|
|
new Swiper(".swiper-deal-list", {
|
|
direction: 'vertical',
|
|
spaceBetween: 10,
|
|
slidesPerView: 3,
|
|
rewind: true,
|
|
speed: 1000,
|
|
autoplay: {
|
|
delay: 2500,
|
|
disableOnInteraction: false,
|
|
pauseOnMouseEnter: "true",
|
|
},
|
|
});
|
|
}
|
|
|
|
// PRODUCT DETAIL
|
|
// PRODUCT THUMBNAIL
|
|
let galleryThumbs = new Swiper(".gallery-thumbs", {
|
|
spaceBetween: 12,
|
|
slidesPerView: 5,
|
|
slideToClickedSlide: true,
|
|
freeMode: true,
|
|
watchSlidesProgress: true,
|
|
centerInsufficientSlides: true,
|
|
});
|
|
|
|
let galleryTop = new Swiper(".gallery-top", {
|
|
spaceBetween: 12,
|
|
slidesPerView: 1,
|
|
speed: 1000,
|
|
autoplay: {
|
|
delay: 2500,
|
|
disableOnInteraction: false,
|
|
pauseOnMouseEnter: "true",
|
|
},
|
|
thumbs: {
|
|
swiper: galleryThumbs,
|
|
},
|
|
// AUTO SILDED AT FISRT AND END
|
|
on: {
|
|
slideChange: function () {
|
|
let activeIndex = this.activeIndex + 1;
|
|
|
|
let activeSlide = document.querySelector(
|
|
`.gallery-thumbs .swiper-slide:nth-child(${activeIndex})`
|
|
);
|
|
let nextSlide = document.querySelector(
|
|
`.gallery-thumbs .swiper-slide:nth-child(${activeIndex + 1})`
|
|
);
|
|
let prevSlide = document.querySelector(
|
|
`.gallery-thumbs .swiper-slide:nth-child(${activeIndex - 1})`
|
|
);
|
|
|
|
if (
|
|
nextSlide &&
|
|
!nextSlide.classList.contains("swiper-slide-visible")
|
|
) {
|
|
this.thumbs.swiper.slideNext();
|
|
} else if (
|
|
prevSlide &&
|
|
!prevSlide.classList.contains("swiper-slide-visible")
|
|
) {
|
|
this.thumbs.swiper.slidePrev();
|
|
}
|
|
},
|
|
},
|
|
});
|
|
|
|
// FANCY-BOX
|
|
$('[data-fancybox="gallery"]').fancybox({
|
|
thumbs: {
|
|
autoStart: true
|
|
}
|
|
});
|
|
|
|
// TOGGLE MODAL
|
|
function toggleModal(target) {
|
|
$(target).toggleClass('d-none');
|
|
$("body").toggleClass('overflow-hidden');
|
|
}
|
|
|