Assistance Required for Mobile Touch Event Issue

Dear Support Team,

When users attempt to scroll through the product details page on mobile devices, they unintentionally select product options (such as size, color, etc.) instead of just scrolling.

For your reference, here is the link to the product experiencing this issue:
https://wingchunelec.com/product/schneider-unica-x-%e9%96%8b%e9%97%9c%e6%8e%a3-%e6%9b%9c%e7%9f%b3%e9%bb%91/?attribute_pa_%25e7%2594%25a2%25e5%2593%2581%25e7%25a8%25ae%25e9%25a1%259e=4%25e4%25bd%258d%25e9%2596%258b%25e9%2597%259c

Hello,

On mobile devices with touchscreens, elements like product swatches are activated using the “touchstart” event. Unfortunately, we cannot modify the scrolling behavior you described because, in this case, there is no distinction between a touch for scrolling and a touch for selecting a variation.

Any other possible manipulations with swatch activation (e.g., using JavaScript) could lead to unintended side effects, such as misclicks or the need for double-tapping when users intentionally try to select a variation.

As an alternative to minimize this effect, we recommend reducing the swatch size on mobile. This way, swatches won’t take up the entire screen at certain points, allowing users to scroll without accidentally triggering a variation selection. If this solution works for you, we can prepare the appropriate custom code.

Best Regards,

[Author]

Posts