• Resolved Tom

    (@esilverstrike)


    Hi,

    I have an issue. FYI I have Elementor installed.

    While on the page everything works fine with smooth scrolling but I installed your plugin to help when loading a page that the url has an anchor and then have smooth scrolling to the anchor.

    It works but when the page loads it first jumps to the anchor, then it jumps to the top of the page and then smooth scrolls back to the anchor.

    I have “Prevent other scripts from handling plugin’s links” option checked.

    How can I fix this jump or flicker?

    I would like the page just to load and be positioned at the top and then scroll down to the anchor.

    Thanks

Viewing 9 replies - 1 through 9 (of 9 total)
  • Plugin Author malihu

    (@malihu)

    Hi,

    This kind of issue is not always possible to solve because it usually has to do with browser’s engine in combination to your theme/page layout.

    Can you post your site/page URL so I can check what happens?

    We might be able to solve this with a custom script and CSS but I’d need to see your page in order to help.

    Thread Starter Tom

    (@esilverstrike)

    Thanks for looking into this.

    I originally was using another older custom solution that didn’t have the flicker but wasn’t taking into account the offset of my sticky menu into account for the menu anchor.

    I really like your plugin but am unsure why the flicker is happening. Here is the page URL (which is also one of my menu items that uses a menu anchor in the URL).

    https://www.esilverstrike.com/services/#section-market

    If a person is on another page and then loads this url (or others like it) with the menu anchor as I described before it jumps first to the menu anchor, then back to the top, then smooth scrolls as it should to the menu anchor.

    Plugin Author malihu

    (@malihu)

    I’m not sure if this will work but try going to plugin settings and set a value of 500 in “delay for scrolling to target on page load” option field (under “Links behavior” section).

    Save changes, test and let me know.

    Thread Starter Tom

    (@esilverstrike)

    The odd time with that setting it would work…

    I left it on so you could see what I mean but the it never really worked for the other anchors farther up the page like

    https://www.esilverstrike.com/services/#section-design

    Do you have any other ideas?

    Plugin Author malihu

    (@malihu)

    Try increasing the value to 1000 or 1500 and see if it works.

    Thread Starter Tom

    (@esilverstrike)

    I should have mentioned I tried a bunch of different lower and higher numbers no real affect.

    I notice in the page source that the javascript for the plugin is loaded in the footer.

    Would moving the javascript to the header right under jquery work better and give it priority over other scripts? (I assume the reason it might be having a problem is some of the other js on the page???)

    Plugin Author malihu

    (@malihu)

    No, moving it to the head won’t make any difference.

    Can you add an extra js script in your theme/child-theme footer.php?

    If yes, try adding the following in your footer.php right before the closing body tag (after wp_footer function):

    <script>
    (function($){
    	if(window.location.hash){
    		var elem=$(window.location.hash);
    		if(elem.length){
    			elem.css("display","none");
    			$(window).on("load",function(){
    		        	elem.css("display","block");
    		    	});
    		}
    	}
    })(jQuery);
    </script>

    I think the extra script is the only way to deal with the issue.
    Test it and let me know.

    Thread Starter Tom

    (@esilverstrike)

    Yup that worked Perfectly.

    THANKS!

    Plugin Author malihu

    (@malihu)

    You’re welcome 🙂

    Marking this as resolved but if you need more help, let me know.

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘When loading a new page it flickers’ is closed to new replies.