I've been trying solutions offered here: https://stackoverflow.com/questions/10732690/offsetting-an-html-anchor-to-adjust-for-fixed-header

I tried something like

#anchor {

    display: block;

    position: relative;

    top: -150px;

    visibility: hidden;

}

It did not work.

I tried creating something for each anchor like this:

a[#g-extension] {

  margin-top: -150px;

  display: inline-block; 

  vertical-align: top;

}

It did not work.

What worked was to use something like this within each module:

<span style="position: relative;"><a style="position: absolute; top: -140px;" name="platform"></a></span>

and then linking to the module name (#platform) instead of the module position (#g-extension).
But what I don't like about this is that what works links to the right place in the site on my desktop does not on my laptop.

TIA for any help you can offer.
Lisa

Ah So Sorry. I did not see your response in the other thread. Going to it now! Thank you!

No problem at all

Ivo,

In this site: http://forma-fund.com.dedi3509.your-server.de/,
the off-canvas onepage menu's anchor links work well,
but my main navigation bar's anchor links land too low on the page
due to my sticky navigation bar/position.

In the past you wrote that I can use this code with offset to adjust a link to an anchor:
Section 1.

However, after another two days of pulling out my hair, I can't figure out how to get that tag (data-uk-smooth-scroll="{offset: 120}") to work on my main navigation menu buttons.

I'd really appreciate any help you can offer.

Best,
Lisa

Hi Lisa,

You are trying to build a complete "One Page" website.
In that case, please have a look at this discussion and especially my comment there and watch the video in it.

The jQuery code that you need to add under the "Page Setting" tab in your Base outline is almost the same as in the other discussion. There is just a minor difference that will add the offset. Here's the code that you need to use:

(function($) {

	$(document).ready(function() {

		$(".g-main-nav .g-toplevel").attr('data-uk-scrollspy-nav', '{closest:".g-menu-item-container", smoothscroll:{offset: 120}}');

	});

})(jQuery);

Ivo - YOU ARE THE BEST!!!
I know this falls outside the Support topics and I know I never could have figured this out on my own.
So THANK YOU!!!
I really appreciate this so much.
Continued success to you!!!!
Lisa

You are welcome Lisa!
And thank you very much for the kind words

Hi Ivo,

Site: https://www.intego-funds.com/dev/
Issue: Top navigation bar button links on this one page site are landing too high

1. I went back to the help you gave me earlier (above) with smooth scroll and top offset:
https://www.inspiretheme.com/forums/anchor-links-scroll-too-far

2. I watched this video 5 times:
https://www.youtube.com/watch?v=kVqQ9hqeq2w&feature=youtu.be

3. I put this code

(function($) {

	$(document).ready(function() {

		$(".g-main-nav .g-toplevel").attr('data-uk-scrollspy-nav', '{closest:".g-menu-item-container", smoothscroll:{offset: 120}}');

	});

})(jQuery);

into the Base Templates-->Page Settings-->Assets-->Javascript.

Then I passed it off to Giora who did the same as me above and much more.

Still the site is not reading the offset 120 and nav bar button links are landing too high.

Maybe there is something in the site that is conflicting with this Javascript?

Sorry to bother you with this. We really gave it all we have.

TIA!
Lisa

Hi Lisa,

Please send me the site details by using the Site Details tab in your next comment so I can have a look.

Thanks Ivo!
The site is https://www.intego-funds.com/dev/.
The site details are below.
If you need FTP, I'll ask Giora for the pw.

Pass is attached

Hi Lisa,

You cannot have smooth scroll (and offset) with your current setup (with these URLs).
Here, have a look at this video that I recorded for you. It shows everything in details.

WOWOWOW!
Such a simple fix.
We're were chasing our tails!
Thank you so so so very much!
Lisa

You are welcome Lisa

Ivo Valkov wrote:

Hi Lisa,

You cannot have smooth scroll (and offset) with your current setup (with these URLs).
Here, have a look at this video that I recorded for you. It shows everything in details.

Dear Ivo, This video shows that you can only have smooth scroll inside of the page there is #links, what about when you are in another page and you want to click form there back to a #section of other's page? can this happen ?

Hi Kostas,

Nope, unfortunately it is not possible.
The smooth scroll functionality works for links/anchors on the same page only.

Thanks you Ivo. For all.

No worries, Kostas!