.swiper-slide { overflow: auto; }
1. 排除某些屏,不滾動
var startScroll, touchStart, touchCurrent; var aSlide = Array.prototype.slice.call(swiper.slides); aSlide.forEach(function(item,index){ //按索引排除某些屏 if(index != 2){ item.addEventListener('touchstart', function (e) { startScroll = this.scrollTop; touchStart = e.targetTouches[0].pageY; }, true); item.addEventListener('touchmove', function (e) { touchCurrent = e.targetTouches[0].pageY; var touchesDiff = touchCurrent - touchStart; var slide = this; var onlyScrolling = ( slide.scrollHeight > slide.offsetHeight ) && //allow only when slide is scrollable ( ( touchesDiff < 0 && startScroll === 0 ) || //start from top edge to scroll bottom ( touchesDiff > 0 && startScroll === ( slide.scrollHeight - slide.offsetHeight ) ) || //start from bottom edge to scroll top ( startScroll > 0 && startScroll < ( slide.scrollHeight - slide.offsetHeight ) ) //start from the middle ); if (onlyScrolling) { e.stopPropagation(); } }, true); } });
2. 按條件排除滾動,消除touchmove影響
var startScroll, touchStart, touchCurrent; swiper.slides.on('touchstart', function (e) { startScroll = this.scrollTop; touchStart = e.targetTouches[0].pageY; }, true); swiper.slides.on('touchmove', function (e) { var slide = this; //排除條件 if($('#swiperWrapper>.swiper-slide-active').next().length == 0 && document.querySelector(self.template).contains(e.target)){ return; } touchCurrent = e.targetTouches[0].pageY; var touchesDiff = touchCurrent - touchStart; var onlyScrolling = ( slide.scrollHeight > slide.offsetHeight ) && //allow only when slide is scrollable ( ( touchesDiff < 0 && startScroll === 0 ) || //start from top edge to scroll bottom ( touchesDiff > 0 && startScroll === ( slide.scrollHeight - slide.offsetHeight ) ) || //start from bottom edge to scroll top ( startScroll > 0 && startScroll < ( slide.scrollHeight - slide.offsetHeight ) ) //start from the middle ); if (onlyScrolling) { e.stopPropagation(); } }, true);