[daveisthemusicParticipant]

Hi guys – quick one!

On my home page I have a little draft for anchored text links (#’s as HREF) to scroll down to the sections below. This is separate from the main navbar menu.

The scrolling works – but only after the page has completely finished loading. If you try to click one of those links when they actually appear, then the site scrolls to that section for a brief second but then jumps right back to the top. It can actually take three clicks before the site stops jumping back and actually just scrolls to that section – and in the meantime the fade events on the section in question have already been triggered.

Can you help me figure out how to fix this jumping back to top issue? Thanks..!

[daveisthemusicParticipant]

This reply has been marked as private.

[daveisthemusicParticipant]

…I’ve actually just seen that the problem happens in Chrome, yet not Safari, so it looks like it’s not an X issue. However, if you know why Chrome does this or have heard about this before I’d love to know if there’s a fix…

edit: I can’t seem to see any other sites with same page jump links that display this behaviour in Chrome, so if you guys could take a look with Chrome, that would be great. Thanks!

[daveisthemusicParticipant]

Ok guys, here’s a video of the issue.

http://www.davethomasmusic.co.uk/video/website.mov

You will see that I click on the link three times before it stops jumping back to the top of the page, and by then the column fade effect has already triggered. This always happens on page load in Chrome.

Thanks again.

[Rue NelModerator]

Hello There,

Are you using CloudFlare or may have installed a caching plugin like WordFence, W3 Total Cache or WP Super Cache? Please keep in mind that after doing every updates and site changes, always remember to clear all caches when updating so that the code from the latest release is always in use. This will help you to avoid any potential errors.

Please let us know how it goes.

[daveisthemusicParticipant]

Hi there,

While developing my Cloudflare is paused (inactive), and W3 Total Cache disabled.

Have you tested this in Chrome?

The only solution I can imagine is if you can somehow force the page to be fully loaded before anything appears, so that the links can’t be clicked before then. But perhaps if you take a look you may have a better solution for me?

[RadModerator]

Hi there,

I checked it in chrome and I’m not getting the same issue shown from the video. Perhaps because it loads faster on my end? True, that javascript will only run when it’s loaded which perhaps why you’re getting that issue on your end. When javascript isn’t attached yet, it will act as normal URL. You may try site preloader or lazyloader, or something similar to load your site.

Thanks!

[Author]

Posts