1 page navigation - Anchors

Support
#1

Good afternoon,

I do not understand why, the anchors of the menus do not scroll until the final position, but they are left half …

For url https://www.grupnoma.com/#contact

  • Incorrect scroll

  • Correct Scroll

Thank you

#2

Hello Mauro,

Thanks for writing in!

I checked the website and the scroll technically is working fine. However, in contact section you have given padding in CSS which visually looks there is a spacing between current and preceding section. Please see screenshot. As a solution, I suggest you to reduce the Top padding value of section.

Thanks.

#3

Good Morning,

The problem is not the padding of the sections. I have seen that when you deactivate the side menu, the scroll adjusts to your site correctly. What I do not understand, is that it can affect the lateral menu …

Without lateral menu

#4

Hello Mauro,

Please try to remove the 10% top padding of the Contacto section then set it to the section’s top margin instead.

Hope this helps.

#5

Good afternoon,

I insist that the problem is not the padding, I have eliminated it and the anchor is still not at the top

The anchor problem happens with all the sections, I’ve put the Contact only as an example.

If you look, the web as it is when you give the menu to the “Contact” option is like this …

But … if I hide the side menu …

The scroll to the anchor is perfect!!

Any ideas?

Thank you

#6

Hi Mauro,

The floating left menu you have might not play well with the one-page menu scrolling because its height is affecting the scrolling calculation. You will need to build that outside of the header either as a custom div or a 3rd party plugin.

Thanks,

#7

Good Morning,

Thanks for the quick reply. I will continue investigating how to solve the problem.

Could you tell me how to calculate the scroll, the jquery code that does it to be able to review it and, if necessary, overwrite it?

Thank you

#8

Good morning,

this code does its function, but it does it after the main one, as in two steps …

$( document).on('click', '.x-menu > li > a', function(e) {
    e.preventDefault();
    var id = $(this).attr('href');
    var section = $(id);

    $('html,body').animate({scrollTop: section.offset().top},'slow');    })
#9

Hello Mauro,

I’d recommend that you disable WP Rocket plugin first while you are testing your code. It might actually work. The Cache of the WP Rocket might just be the reason why there is a delay or some issues with it.

Clear the caches, disable the WP Rocket and any other caching plugin. Clear your browser cache as well and test again.

Please let us know how it goes.

#10

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