"use strict"; (function () { var isSmallScreen = false; //是否手机小屏幕 var smallScreenWidth = 768; //手机小屏幕的宽度判断值 var container = $('#solution'); var content = container.find('.content'); var navSwiper; var detailSwiper; var swiperIndex = 0; function navSwiperInit() { navSwiper = new Swiper($('.content-m .solution-nav-container')[0], { autoplay: false, spaceBetween: 20, slideClass: 'solution-nav-swiper-slide', wrapperClass: 'solution-nav-swiper-wrapper', slidesPerView: 'auto' }); } function detailSwiperInit() { detailSwiper = new Swiper($('.solution-detail-container')[0], { autoplay: false, on: { transitionEnd: function transitionEnd(swiper) { var activeIndex = swiper.activeIndex; swiperIndex = activeIndex; var taglist = container.find('.tab-tag li'); taglist.removeClass('current'); $(taglist[swiperIndex]).addClass('current'); navSwiper && navSwiper.slideTo(swiperIndex); } } }); } detailSwiperInit(); function screenWithChange() { if (navSwiper) { navSwiper.destroy(); navSwiper = null; } if (isSmallScreen) { navSwiperInit(); } } function checkScreenWith(screenSizeChange) { var clientWidth = document.documentElement.clientWidth; if (clientWidth > smallScreenWidth) { isSmallScreen = false; } else { isSmallScreen = true; } if (isSmallScreen) { content.addClass('content-m'); content.removeClass('content-pc'); } else { content.addClass('content-pc'); content.removeClass('content-m'); } screenSizeChange && screenSizeChange(); } checkScreenWith(screenWithChange); $(window).on('resize', function () { checkScreenWith(screenWithChange); }); //技术解决方案 container.on('click', '.tab-tag li', function () { $(this).addClass('current').siblings('li').removeClass('current'); var index = $(this).index(); swiperIndex = index; detailSwiper.slideTo(index); }); })();