Docs

[JayCPT]

Hi Guys!

I’m using UberMenu as a secondary menu to easily jump to different services available on my website. I’ve managed to get this all working well, BUT on the first click (of any menu item) the page scrolls WAY too far and you lose half of the section.

How can I get it so that it scrolls to the top of the section (just above the purple heading) whenever a link is clicked? (I will post the link to my site following this).

Thank you in advanced!
Josh

[JayCPT]

This reply has been marked as private.

[Rue Nel]

Hello There,

Thanks for writing in! Your site is in under construction mode. To assist you better with this issue, would you mind providing us the url of your site with login credentials so we can take a closer look? This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

To do this, you can make a post with the following info:
– Link to your site

– WordPress Admin username / password

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

Thank you.

[JayCPT]

This reply has been marked as private.

[Rupok]

Hi there,

Thanks for writing back. You have two Menus on the header and when you are logged in, the admin bar is there. So it’s actually more than 100px that’s being occupied by the header area and your section is going behind the header.

Hope this makes sense.

[JayCPT]

Ahhh yes that does make sense!

How do I easily get it to scroll under the header area?
And will this be adjustable per page or will it be set the same for the whole site?

I ask the second question as I only have two menus on the Services page. The other pages do not have UberMenu used, only the vertical menu.

Thank you for your help!

[Rupok]

Hi there,

It would be possible if you use larger margin-top or padding-top for the section but it won’t look good. Actually there is no feasible solution if you have two menu fixed on top occupying such large space.

Thanks!

[JayCPT]

Yeah you’re right, it won’t look good.

When searching I found and tried old code attempts such as:

jQuery(document).ready(function(){
    jQuery('a[href^="#"]').on('click',function (e) {
        e.preventDefault();

        var target = this.hash,
        jQuerytarget = jQuery(target);

        jQuery('html, body').stop().animate({
            'scrollTop': jQuerytarget.offset().top-220
        }, 900, 'swing', function () {
            window.location.hash = target;
        });
    });
});

Is it possible to achieve what I’m looking for with a code similar to this?
(original code found in this post: https://community.theme.co/forums/topic/anchor-link-scrolls-too-far-top-is-covered-by-x-navbar/)

[Rad]

Hi there,

That code should work, but there is something preventing it. Like stopPropagatio(), would you mind backing up your site first? I like to disable other plugins and features while testing the javascript.

Thanks!

[JayCPT]

Hi Rad,

Sorry for the delay in response (is it possible to turn on notifications so I know when you have replied?).
I have just backed up my site and database, so you are free to test.

Thank you!

[Paul R]

Hi,

I was able to fix it by adjusting the scrollto offset in ubermenu general settings.

I also remove the code in custom > javascript.

Kindly check in your end. Make sure to clear your cache first.

Thanks

[JayCPT]

THANK YOU PAUL!!!

Works perfectly.
You guys are great! Thank you for your help and so much input from so many voices.

Definitely in the right place – I completely missed those settings.

Thanks again!

[Christian]

You’re welcome.

[Author]

Posts