Navigation anchor bug

Hi! A while ago I reported an issue with the navigation anchors offset here: https://xtemos.com/forums/topic/woodmart-sticky-header-causes-a-bug-it-covers-the-heading-in-the-page/, it was fixed with a patch.
While all is working well on desktop, I notice it doesn’t work at all on mobile. Can you please check? Link to a page with anchors attached in the private area. Thank you very much in advance!

Hello,

You need to enable the following option for mobile https://monosnap.ai/file/7bw5BNhfDfoEriIFmWOq0PVTJDNRdC

Kind Regards

Hello, I am afraid this didn’t work. Can you please check? Attached is temporary access.

As we can see, it works correctly on your website at the moment. Please check the video https://monosnap.ai/file/fsi1Ero1I4bp3LqRcCpgSA2D8ylgqO

Hello, I am afraid you’re missing the point. Yes, the scroll to anchor actually works, but there is so much unnecessary space. Can you please check how it works on desktop? The anchor is right above the heading. On mobile it’s as if part of the previous paragraph. I am attaching two screenshots for better understanding.

Attachments:

You must be logged in to view attached files.

This happens because there is a 100px offset set for desktop, and the same offset is applied on mobile. That’s why it appears like that on smaller screens.

Yes, I know. Your default value for this widget (which is your theme’s) is even 150px. You haven’t provided the ability to add different values for desktop and mobile. I think this is very important. What can be done about this?

To fix this issue, try to add the following code snippet to the Custom JS on the document ready area in Theme Settings to change this

(function($) {
	
	if ($(window).width() <= 768) {
		$('.wd-menu-anchor').data('offset', '10');
	}

})(jQuery);

Wonderful, I really appreciate it! This worked perfectly. Are you also able to advise a value for tablet as well?

Try to replace the code with the following one

(function($) {

    var w = $(window).width();

    if (w <= 768) {
        $('.wd-menu-anchor').data('offset', '10');
    } else if (w <= 1024) {
        $('.wd-menu-anchor').data('offset', '30');
    }

})(jQuery);

[Author]

Posts