Page jumps on mobile

Hello,

we encountered a strange behaviour on mobile. When I scroll to a certain position on the page, the page jumps up. This behaviour only occurs on mobile. First I thought this comes from the sticky header but I disabled it and it still occured. Then I completely disables Woodmart’s lazy loading with the following code snippet (I use WP Rocket):
function woodmart_lazy_loading_init( $force_init = false ) {}

But even after that the page jumps still occured. So I used the browser debugger to find the JS script from where the jump comes from and I found that it is woodmart/js/libs/waypoints.min.js?ver=7.5.1

You can see it happen in the following two videos: https://1drv.ms/f/s!AnpjDm99bZAzg81bMhyjMo1KvrD7Cw?e=99UvQo

In the video pageJumps-0 you can see at 0:33 that the error occurs within that code block.

These jumps somehow are linked to the resize event. It gets triggered when the mobile browser shows the URL bar or hides it.

How can I prevent these jumps?

Best regards

Hello,

Please disable any plugins not directly related to our theme and provide us with your admin access details. We will log in to your dashboard and investigate the issue. Please ensure that you only keep the following plugins that are necessary for our theme to work correctly:
– WoodMart core
– WooCommerce
– Elementor/WPBakery Page Builder

Thank you in advance.

Hello,

all not essential plugins are deactivated.
Login credentials are attached below. I can reproduce the error with just the essential plugins activated. Just follow these steps to reproduce it:

* use Google Chrome
* switch to the mobile mode and select some mobile phone (it doesn’t matter which one) for the dimension
* switch the dimension to “Dimensions: Responsive”
* visit staging.tegards.com/glasschiebewand
* scroll down below the slider with the title “Glasschiebewände in vier Trendfarben”
* open the point “Robuste Konstruktion” and “Sondergrößen”
* close both points
* scroll down so that the two cards “Sommergärten” and “Balkone” are in the field of view
* click on the card “Sommergärten” so that the text on the back is visible
* click on the card “Balkone” so that the text on the back is visible
* click again on the cards “Sommergärten” so that the text on the back is visible
* scroll down so that the cards “Innenräume” and the heading “Öffnungsvarianten” is in the field of view
* Change the height dimension of the device. To do that press on the bar at the very bottom and change the height a few pixel. This will trigger the page jump. With this step I simulate the hiding / display of the URL bar / bottom menu on the mobile device. If you want to try this out on a mobile phone just scroll a few pixels up / down.

The error is resproduceable with the browsers “Samsung Internet” (Chromium based) (tested on S10 and S24 Ultra) and Google Chrome on Desktop in the mobile mode as described above.

Sometimes it takes a few tries to see this behaviour. Just scroll up to the cards “Sommergärten” and “Balkone” and switch the selection between them. Afterwards scroll down again and do the last step described above.

I can reproduce the error both logged out and logged in with your user.

Best regards

We just tested it with the default theme and see the same jump. It means that this bug is not related to our theme. Most likely it is related to some of the WPBakery page builder elements.
Here is a video https://gyazo.com/9381395bc6002b4cb7ebe6ad2d6b3f73

Thanks for your fast response!

What does that mean now? How can I fix this?

Hello,

We don’t know exactly what is causing the issue, but you can try the following steps to troubleshoot and potentially resolve it:

Remove all elements from the page.
Add the elements back one by one, testing for the jump issue after each addition. This can help identify which element might be causing the problem.
If the issue persists, you can report it to WPBakery via their comments section for further assistance. They might have more insights on this behavior and how to fix it.

Best regards,

[Author]

Posts