//下方推薦商品輪播 ;(function($) { const block = $(".detail-panel-carousel") block.each(function(){ const _this = $(this) updateSwiper(_this) $(window).on("resize", function(){ updateSwiper(_this) }) }) function initSwiper(parent){ let swiperEl = parent.find('.swiper')[0] if(!swiperEl){ return } const swiper = new Swiper(swiperEl , { loop:false, centeredSlides: false, touchReleaseOnEdges: true, passiveListeners: true, navigation: { nextEl: parent.find('.swiper-button-next')[0] || null, prevEl: parent.find('.swiper-button-prev')[0] || null, }, pagination: { el: parent.find('.swiper-pagination')[0] || null, clickable: true }, breakpoints: { 0: { slidesPerView: 2, spaceBetween: 12 }, 576: { slidesPerView: 3, spaceBetween: 12 }, 768: { slidesPerView: 4, spaceBetween: 16 }, 1200: { slidesPerView: 4, spaceBetween: 20, slidePerGrroup:4 }, }, on: { init: function(){ updateToolbar(parent) }, resize: function(){ updateToolbar(parent) } } }) } function updateToolbar(parent){ let toolbar = parent.find(".swiper-toolbar") if(toolbar.length){ if($(window).width() < 576){ checkToolbar(parent, toolbar, Infinity) }else if($(window).width() >= 576 && $(window).width() < 768){ checkToolbar(parent, toolbar, Infinity) }else if($(window).width() >= 768 && $(window).width() < 1200){ checkToolbar(parent, toolbar, Infinity) }else if($(window).width() >= 1200 && $(window).width() < 1440){ checkToolbar(parent, toolbar, 4) }else{ checkToolbar(parent, toolbar, 5) } } } function updateSwiper(parent){ let swiperTarget = parent.find(".swiper") if(swiperTarget.length && swiperTarget[0].swiper){ swiperTarget[0].swiper.destroy(true, true) } updateToolbar(parent) initSwiper(parent) } })($)