A user is experiencing laggy scrolling animations on mobile devices while they display smoothly on desktop. They want to disable these animations specifically for mobile views.
Solution provided:
animation-duration and animation-delay to 0s with !important flags@media only screen and (max-width: 768px) or adjust the breakpoint to match the theme’s mobile breakpoint (e.g., 749px)Key limitation:
The discussion includes a code snippet demonstrating the implementation and appears resolved with this workaround approach.
You can add custom css to disable animations on mobiles in theme settings. What I did was to make all animation durations 0s and also delays. That way it does not animate. It’s not the cleanest solution but it works.
Hope this will help you guys if you struggle with the same issue!
@media only screen and (max-width: 768px) {
* {
animation-duration: 0s !important;
animation-delay: 0s !important;
}
}
