162 lines
3.1 KiB
JavaScript
162 lines
3.1 KiB
JavaScript
$(document).ready(function () {
|
|
// GLOBAL CALL
|
|
globalHandler();
|
|
|
|
// PAGE CALL
|
|
homepageHandler();
|
|
categoryHandler();
|
|
productDetailHandler();
|
|
|
|
});
|
|
|
|
|
|
//
|
|
function globalHandler() {
|
|
swiperBannerHeaderTop();
|
|
mmenuHandler();
|
|
arccodionHandler();
|
|
}
|
|
|
|
//
|
|
function swiperBannerHeaderTop() {
|
|
new Swiper(".swiper-banner-header-top", {
|
|
slidesPerView: 1,
|
|
spaceBetween: 0,
|
|
rewind: true,
|
|
speed: 1000,
|
|
navigation: {
|
|
nextEl: ".swiper-button-next",
|
|
prevEl: ".swiper-button-prev",
|
|
},
|
|
});
|
|
}
|
|
|
|
//
|
|
function homepageHandler() {
|
|
swiperSectionHero();
|
|
swiperSectionBestSeller();
|
|
swiperSectionCategory();
|
|
}
|
|
|
|
// SWIPER SECTION HERO
|
|
function swiperSectionHero() {
|
|
new Swiper(".swiper-section-hero", {
|
|
slidesPerView: 1,
|
|
spaceBetween: 0,
|
|
rewind: true,
|
|
speed: 1000,
|
|
autoplay: {
|
|
delay: 2500,
|
|
disableOnInteraction: false,
|
|
pauseOnMouseEnter: "true",
|
|
},
|
|
});
|
|
}
|
|
|
|
function swiperSectionBestSeller() {
|
|
new Swiper(".swiper-section-best-seller", {
|
|
slidesPerView: 2,
|
|
spaceBetween: 10,
|
|
rewind: true,
|
|
speed: 1000,
|
|
autoplay: {
|
|
delay: 2500,
|
|
disableOnInteraction: false,
|
|
pauseOnMouseEnter: "true",
|
|
},
|
|
pagination: {
|
|
el: ".swiper-pagination",
|
|
clickable: true,
|
|
},
|
|
breakpoints: {
|
|
768: {
|
|
slidesPerView: 3,
|
|
},
|
|
},
|
|
});
|
|
}
|
|
|
|
function swiperSectionCategory() {
|
|
new Swiper(".swiper-section-category", {
|
|
slidesPerView: 2.2,
|
|
spaceBetween: 0,
|
|
rewind: true,
|
|
speed: 1000,
|
|
breakpoints: {
|
|
768: {
|
|
slidesPerView: 3.2,
|
|
},
|
|
},
|
|
});
|
|
}
|
|
|
|
//
|
|
function categoryHandler() {
|
|
|
|
}
|
|
|
|
//
|
|
function productDetailHandler() {
|
|
|
|
}
|
|
|
|
let galleryThumbs = new Swiper(".gallery-thumbs", {
|
|
spaceBetween: 8,
|
|
slidesPerView: 5,
|
|
slideToClickedSlide: true,
|
|
freeMode: true,
|
|
watchSlidesProgress: true,
|
|
centerInsufficientSlides: true,
|
|
});
|
|
|
|
let galleryTop = new Swiper(".gallery-top", {
|
|
spaceBetween: 0,
|
|
slidesPerView: 1,
|
|
speed: 1000,
|
|
autoplay: {
|
|
delay: 2500,
|
|
disableOnInteraction: false,
|
|
pauseOnMouseEnter: "true",
|
|
},
|
|
navigation: {
|
|
nextEl: ".swiper-button-next",
|
|
prevEl: ".swiper-button-prev",
|
|
},
|
|
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();
|
|
}
|
|
},
|
|
},
|
|
});
|
|
|
|
$('[data-fancybox="gallery"]').fancybox({
|
|
thumbs: {
|
|
autoStart: true
|
|
}
|
|
}); |