One Page Navigation Offset - Swing back on mobile problem

I used a code that was mentioned here several times, starting with:

$('a[href*="#"]').off('touchstart click'); var $body = $('body'); var bodyHeight = $body.outerHeight(); var adminbarHeight = $('#wpadminbar').outerHeight(); var navbarFixedTopHeight = $('.x-navbar').outerHeight() - 32; var locHref = location.href; var locHashIndex = locHref.indexOf('#'); var locHash = locHref.substr(locHashIndex);

It works as it should on desktop and mobile as well, but on mobile devices (I tested with iPhone and iPad) the page stops for a moment the wanted section and then scrolls a bit further ignoring the offset, so the sticky navigation covers parts of the content. Is there a solution? :slight_smile:

Best regards.

Hi there,

Thank you for your message, I guess you are referring to this workaround:

Please kindly consider that this is a temporary workaround for a feature that is not available on the Pro theme yet. You will need to wait for an official release of the ePro theme including this feature.

At the time being, we do not have any alternative for this code on mobile devices.

Thank you for your patience and understanding.

The code I quoted was in several threads (with minor changes/fixes). Hoped someone found a solution for the “swing-back to default” on mobile devices.

The small site goes live tomorrow… hope the client don’t mind or I find another way.

Edit: I made a quick fix by adding divs without content but relative negative positioning within each navigation target content band. That way no extra JS is needed. It’s not getting the height of the navigation automatically, but it works for that little project :slight_smile:

That is a good alternative for now. Please stay tuned for updates.

Thanks.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.