Добрый день.
На странице несколько товарных слайдеров, используется slick-slider. Но свайп на мобильных у него отчего-то сильно заторможен.
Поэтому он реализован так:
var xCoordStart,
yCoordStart,
xSlideTrigger = 50,
slickElement = $('.slider'),
slickElement.each(function(index, sliderItem){
$(sliderItem).bind('touchstart', function (e){
xCoordStart = e.originalEvent.touches[0].clientX;
yCoordStart = e.originalEvent.touches[0].clientY;
});
$(sliderItem).bind('touchend', function (e){
var xCoordEnd = e.originalEvent.changedTouches[0].clientX;
var yCoordEnd = e.originalEvent.changedTouches[0].clientY;
var deltaX = Math.abs(xCoordEnd - xCoordStart)
var deltaY = Math.abs(yCoordEnd - yCoordStart)
console.log('x - ' + deltaX)
console.log('y - ' + deltaY)
if(deltaX > deltaY){ // prevent slide while scrolling vertically
if(xCoordStart > xCoordEnd + xSlideTrigger){
$(sliderItem).slick('slickNext');
}
else if(xCoordStart < xCoordEnd + xSlideTrigger){
$(sliderItem).slick('slickPrev');
}
}
});
Подскажите, пожалуйста, как останавливать вертикальный скролл всей страницы, когда прокручивается слайдер?