-
-
I have enabled sticky nav (with a 60px height) and I have a menu that has links to sections of the page, e.g. “about-us/#team”. The issue is, when a user clicks the link the row with the #team id tag has its top 60px covered by the sticky nav!
Is there a better solution to this besides creating an empty space of 60px above my row? — that changes the entire page layout.
-
-
-
Currently I have a 60px Empty Space above the row that has the ID tag. This is not a good solution because it creates a lot of empty space and changes the layout of the page.
-
Hello,
Please go to the Row Settings > Padding Top, set it 40. This will give the necessary distance from sticker menu.
Best regards!
-
That still results in extra space being added so that Sticky Nav will not overlap text. Is there a solution where the Sticky Nav will move to the correct location without my layout being impacted?
Can Sticky Nav not work with One-page designs?
-
Hello,
Sticky navigation has no issue with either normal site nor one-page site. make sure you have enabled ‘Smooth scroll’ in General Options > Smooth Scroll.
-Please go to file js/jquery.onepage.js and find these lines:scrollTo: function(target, callback) { var offset = $(target).offset().top; $('html, body').animate({ scrollTop: topposition }, this.config.scrollSpeed, this.config.easing, callback); },
Replace with these:
scrollTo: function(target, callback) { var offset = $(target).offset().top; var topposition = offset - 70; $('html, body').animate({ scrollTop: topposition }, this.config.scrollSpeed, this.config.easing, callback); },
Let us know.
Best regards!
-
-
Hello everyone,
unfortunately this is not working for as it seems.
I have enabled Smootscroll and Stiky Nav too.
Does that work for normal anker links or just if you enable function ‘Use menu as one page menu’ on the page itself?
Thank you
-
Hi Mihaila,
sorry for being not precise enough.
My problem is that all anchor links of the website jump too far as the Sticky Nav is covering the actual beginning of the section where an anchor link is supposed to jump to.
So what I would like to have is the adjustment like described above in the onepage.js file but when I do so there is no difference. As soon as I deactivate the Sticky Nav everything is working properly.
Best regards!
-
Hello,
That’s because the link to the section will place the top-left corner of that section to the very top-left corner of the browser’s window. Sticky navigation scrolls from that top position-> down.
I suggest you change the top position value in the code above. Find this line:
var topposition = offset - 70;
Change the value [-70] until you are satisfied with the result.Best regards!
-
Hello Mihalia,
done. Thank you very much.
Best regards.
-
Hello,
I made the changes, but i see you do not have a one-page layout set up at the moment. All the menu items link to external pages.
Let me know what can we help you with.Best regards!
-
Hi Mihaila,
that’s right, it is a link to an other page. Nevertheless I refer a clear #tag so it should know where to jump to, but its not working properly.
Thats the problem =(
-
You must be logged in to reply to this topic.