function enableHorizontalScroll(listId) {
const list = qs(`#${listId}`);
let maxScroll = list.scrollWidth - list.offsetWidth;
let startX = 0;
let currentX = 0;
let finalOffset = 0;
let lastX = 0;
function startTouch(e) {
startX = e.touches[0].clientX + lastX;
}
function moveTouch(e) {
// prevent vertical scrolling
e.preventDefault();
currentX = e.touches[0].clientX;
finalOffset = startX - currentX;
if (finalOffset < 0) finalOffset = 0;
if (finalOffset > maxScroll) finalOffset = maxScroll;
list.style.transform = `translateX(-${finalOffset}px)`;
lastX = finalOffset;
}
list.addEventListener("touchstart", startTouch);
list.addEventListener("touchmove", moveTouch);
}
enableHorizontalScroll("product-selection-scroll");
< /code>
- men's clothing
- women's clothing
- electronics
- jewelery
Подробнее здесь: https://stackoverflow.com/questions/796 ... refresh-it
Мобильная версия