-
Posts
-
Hi,
I created a small side navigation that uses the same “you are here” mechanic as the navigation in your one page demo. There’s a problem though: it seems the calculation doesn’t consider the submenu height. Clicking on an item brings you to the right section, but you have to scroll a tiny bit for the navigation to catch up.
For this particular case it would be even better if not the top edge but the center of the window would be used.
regards
I might as well add another issue:
in IE the logo jumps to the left. This only happens on pages with transparent header. For example the homepage with normal header looks right, as it should.Hey!
would be best for us to separate different questions into different tickets.
I am not sure what you mean with your first post, because on the link you have provided I can’t see what you are showing on your screenshot. Are you sure you have provided us the correct link? because we need to inspect the elements.
I think we might need admin access to help you further. Post login details here as private reply.Best regards,
AndyHi,
the side navigation I’m talking about only shows on resolutions higher than 1280px, so yu might not see it on smaller screens. It’s class is called “side-nav”. The menu links have id’s just like your one-page demo. So “menu-item-3” goes to the right anchor, in that case “#merkmale” but it only highlights once you surpass the headline (because the submenu height wasn’t considered).
I can post admin login if necessary or describe it in german, if thats any help. :)
I post another ticket for the other issue.
regards
Hi!
Please edit js > avia.js, look for this code around line 716:
var tempPadding = parseInt($main.data('scroll-offset'),10) || 0, non_shrinking = parseInt($meta.outerHeight(),10) || 0, non_shrinking2 = parseInt($alt.outerHeight(),10) || 0; if(tempPadding > 0 && shrink) { tempPadding = (tempPadding / 2 ) + non_shrinking + non_shrinking2; }.. replace it with:
var tempPadding = parseInt($main.data('scroll-offset'),10) || 0, non_shrinking = parseInt($meta.outerHeight(),10) || 0, non_shrinking2 = parseInt($alt.outerHeight(),10) || 0, $subnav = $('.html_header_top .av-submenu-container'), non_shrinking3 = parseInt($subnav.outerHeight(),10) || 0; if(tempPadding > 0 && shrink) { tempPadding = (tempPadding / 2 ) + non_shrinking + non_shrinking2 - non_shrinking3; }Best regards,
IsmaelThanks,
unfortunately it won’t change anything. It seems the if condition never fires, as removing it completly also has no effect. I made sure the updated avia.js is actually used.
best regards
GeroHey!
Thank you for the update. We’ll do a little test. Look for this block of codes:
var tempPadding = parseInt($main.data('scroll-offset'),10) || 0, non_shrinking = parseInt($meta.outerHeight(),10) || 0, non_shrinking2 = parseInt($alt.outerHeight(),10) || 0; if(tempPadding > 0 && shrink) { tempPadding = (tempPadding / 2 ) + non_shrinking + non_shrinking2; } else { tempPadding = tempPadding + non_shrinking + non_shrinking2; }.. then replace it with:
var tempPadding = parseInt($main.data('scroll-offset'),10) || 0, non_shrinking = parseInt($meta.outerHeight(),10) || 0, non_shrinking2 = parseInt($alt.outerHeight(),10) || 0, $subnav = $('.html_header_top .av-submenu-container'), non_shrinking3 = parseInt($subnav.outerHeight(),10) || 0; if(tempPadding > 0 && shrink) { tempPadding = (tempPadding / 2 ) + non_shrinking + non_shrinking2 - non_shrinking3; console.log('test a ' + tempPadding); } else { tempPadding = tempPadding + non_shrinking + non_shrinking2; console.log('test b ' + tempPadding); }We added a console.log function so that we can know whether it’s actually working or not. Hard refresh the page before testing it.
Regards,
IsmaelI get: test b 50
If I add or subsctract 500 from tempPadding-b, I get no visible change. Could it be, that the following code directly after the whole if block, overrides the changes?
tempPadding += parseInt($('html').css('margin-top'),10); fixedMainPadding = tempPadding;Hey!
Alright. Please edit this part:
tempPadding = tempPadding + non_shrinking + non_shrinking2; console.log('test b ' + tempPadding);.. replace it with:
tempPadding = tempPadding + non_shrinking + non_shrinking2 - non_shrinking3;Cheers!
IsmaelSorry, still no difference :(
If I set tempPadding to 500 or -500 it won’t affect the menu either, not the slightest difference. Console reports changed values though.Hi!
Alright. Please hard refresh the page every time you test the codes. Post the ftp details here. We would like to check it.
Regards,
IsmaelAhh, I just retested. Its working. I was expecting it to react to the scrollbar much more, but it did change the higliting of menu items when you click them at least.
I guess I have to change another value to make it react to normal scrolling more as I wish.
Thank you for your help!
Are you going to add this to the next release?
Hi!
Great! Glad Ismael could help :)
Please feel free to request it here – https://kriesi.at/support/enfold-feature-requests/Best regards,
Yigit
- You must be logged in to reply to this topic.