6

Product Image element / Mobile Improvement


N
nas K

When swiping through the image list on mobile, the page moves up and down as you swipe through the images side ways. The images do not swipe as smoothly as all other stores made outside gempages. Even on shopify free themes this does not happen. On pagefly this does not happen. This makes the store seems very buggy and unprofessional. I have never come across a website that has this issue.

A

Activity Newest / Oldest

Avatar

Chris

Status changed to: In progress

Avatar

Chris

Status changed to: Planned

A

Abdulhamit Akaslan

Hey nas, I was having same problem and solve it myself. Here are the instructions to solve it:
- Add Liquid element to page.
- Click Edit Liquid
- Come to Script tab and replace code with following code:
(function (jQuery) {
window.onload = function () {
"use strict";
window.addEventListener("touchstart", touchStart);
window.addEventListener("touchmove", preventTouch, {
passive: false,
});
};

let firstClientX, clientX;

const preventTouch = (e) => {
const minValue = 5; // threshold

clientX = e.touches[0].clientX - firstClientX;

// Vertical scrolling does not work when you start swiping horizontally.
if (Math.abs(clientX) > minValue) {
e.preventDefault();
e.returnValue = false;

return false;
}
};

const touchStart = (e) => {
firstClientX = e.touches[0].clientX;
};
})(window.GemQuery || jQuery);


  • Avatar
  • Avatar
  • Avatar