du_an_khach_hang/Maychuchinhhang/js/main_mobile.js

$(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
  }
});