For the page provided, it looks like it’s scrolling as best it can to the appropriate spots.
Can you elaborate a bit more with perhaps a specific in-page link for an example?
Hi Michael, as I said I am not sure if I have a way to reproduce the problem, but maybe this shows the problem: There are three small content blocks beside each other on top of the main column with a blue icon and a link “Mehr…” (“more…” in German). The first one has the same URL as I have sent with my first message here. When I click the first link “Mehr…” the plugin ignores the offset completely. I hope the failure can be reproduced by you that way.
I’ve noticed that when starting from the very top, it seems to not go to where I assume you intended to scroll to. and keeps doing that as I scroll all the way back up.
However, if I scroll only part way, and then click on the link, it keeps the “Kampagnenführung” heading uncovered.
That said, your fixed header also changes sizes on the user, and I wonder if maybe the more condensed version was used for the calculation for an offset, when perhaps the larger version when at the very top should be. Looks like a difference of about 30px in height.
Yes, Michael, you’re right. I tried out the same. Clicking the Mehr-Link under “Kampagnen” from the top position of the page the plugin fails. If I only scroll some centimeters until the menue bar has already changed its size the final scroll position will be perfect.
I guess there is some Javascript that asks for the ID or ID.top of the smaller menue bar and places the page some pixels lower (offset) than this value. If the smaller menue is invisible because the bigger version is being displayed the plugin fails because it is using the wrong menue bar attributes.
This is my idea now about the problem after we learned to reproduce the problem.
But I don’t know if this might help me to make the plugin work correctly.
I guess the plugin can’t handle the two different menue bars in my theme. I think they programmed it for just a simple sticky menue.
Sounds more or less correct in that we haven’t coded this in such a way to handle variable fixed headings, especially since we store the intended offset as part of an option in the admin.
Part of me is wondering if there’s a way we could do this more dynamically and responsively, but that’d also need some investigation and testing, of course. Perhaps instead of an option to set the offset, provide a way to specify a selector to use and get the height dynamically from that.
Now you have me thinking a little.
> provide a way to specify a selector
I guess it could be an array. Cause then the plugin can look for all statuses of menue bars. Just an idea….
The theme that I use is one of the most successful with WordPress. So it is not so special what I do, I guess.
Would all depend on implementation. For example with your site specifically, if we provided a selector to use instead of a hardcoded offset, you’d be able to just specify #site-navigation since your nav tag doesn’t change in that regard, just the height based on applied classes at any given time and position in the page.
We’ll see what comes of this. I noticed we had a similar enhancement idea over at https://github.com/WebDevStudios/Hash-Link-Scroll-Offset/issues/17 for which I added my notes from this thread to.
Yes, you’re right, it is only one <nav>-Tag with the ID #site-navigation. Would be great if you could find a solution. 🙂
Hi Michael,
I just noticed that something else seems to be wrong with the plugin together with my theme Futurio: I indicated an offset of 73 pixels. This should give enough space to the anchored headline because it is the menue bar plus some more pixels for the shadow under it. But it seems as if the offset is being ignored. Is it the same problem? Or could it eventually be easier for you to find a solution for flexible menue bars?
Thomas
Not quite following, since it sounds like previous discussion hasn’t lead to a final workable enough solution. Is that correct?
Is it still set at a value that works for when the smaller version of the menu is displayed?
I can’t make any promises on timeline for the idea of offering the selector version of the plugin, it was more a generated idea that I logged as a future enhancement.
Is it still set at a value that works for when the smaller version of the menu is displayed?
Yes, it was while you were on my website, and it still is set to 73 px.
Not quite following, since it sounds like previous discussion hasn’t lead to a final workable enough solution. Is that correct?
Looks like. Although the idea about the selector sounds very practicable. Because of that I wanted to inform you that the offset seems to fail on my site too.
the biggest issue is still that variable nav part, and that’s not something I can easily fix up for you right here, and the selector idea is a future enhancement idea, that in theory would help out overall for these cases.
That said, the plugin works, but not in this specific case because of the variation depending on where you are on the screen. It’s presently coded for a static height that it needs to offset from.
Maybe I understand it in a wrong way, but if the offset is a number of pixels that the page should scroll more than the normal anchor links do in a browser (with no sticky navigation) then is should work anyway on my website (because 73 pixels is enough space for the menue bar), or didn’t I understand the offset function correctly?
Looking at https://github.com/WebDevStudios/Hash-Link-Scroll-Offset/blob/0.2.0/assets/js/src/hash-link-scroll-offset.js#L103 which is where the scroll position is set at.
We get the offset of the element, in this case your headings themselves, and then subtract the saved offset value from the plugin, so that it doesn’t scroll QUITE that far, and keeps the heading visible from underneath whatever floating portion of the page is present.
As we established, when scrolled enough to have the smaller nav bar, and clicking to scroll to the heading, it’s working well with the 73px offset.
However, when at the very top of the page, and fuller height nav is in place, 73px isn’t quite enough to keep the heading fully revealed when clicking to the heading. The heading’s offset isn’t the same value.
From the very top, the offset of “Kampagnenführung” heading is roughly 834px
Scrolled slightly, it’s roughly 753px, give or take some bits.
Thanks a lot Michael, to check all this. I’m afraid it will not possible to fix my problem. Anyway, thank you very much.
