-
Posts
-
Hi There,
I’ve got a test site under construction here test6.mccanwebdesign.co.uk
I’ve *sort of* set things up so that clicking on things on the main menu scrolls you in-page to that section in the home page. I say sort of because I’ve done some funky stuff with the menu – see later.
The problem is that the little underline to show the selected/active item in the main menu is behaving erratically. Sometimes, after you click on an item on the main menu and the page scrolls to the place in the page, the active item has the underline and other times it doesn’t (and the wrong thing is underlined). Scrolling around in page will also randomly highlight the wrong menu item too.
I don’t have multiple anchors with the same ID.
I can’t put my finger on why. Playing with the menu links sometimes helps, but it’s like playing that mole-whacker game, I get one sorted out and another one breaks.
I’ve tried adding some JS to help with this one-page setup (as per https://kriesi.at/support/topic/navigation-menu-for-long-single-page-website-with-enfold/) but that hasn’t helped.
Does anyone have any clues? Go to the site and have a play.
More info on the menu set-up and the funky stuff I referred to earlier. I’m using a plugin so that the main menu on the home page is different to the other pages. That way I can have ‘one page website’ behaviour on the front page, but once you dig into a subpage, the menu changes so you can navigate between pages rather than it trying to take you to a non-existent anchor in page (because the ‘usual’ menu is set up for the home page anchors). I hope this makes sense. And before you say that my problem could be related to this plugin, it’s not. I had the problem before I started to use the plugin.
As an update, I’ve been inspecting what’s going on and it looks like the JS is triggering “current-menu-item” in odd situations. For example, as you scroll down the page slowly, I’d expect there to be just one current-menu-item and for it to be related to the section you are in. But, as you scroll down I see current-menu-item being applied to odd li items.
I tracked down a couple of issues and fixed them, but I’m still having problems. The main one now seems to be that as you click on a new item in the menu, the old one isn’t ‘un-highlighted’
Also that the menu item called R&D doesn’t work like the others at all. Could this be because of the & in the name?
Update 2:
I have found the problem. It’s to do with the advanced layer slider.
I broke my homepage into sections using a combination of Coloured Sections and Advanced Layer Sliders. If the only layer slider on the page is at the top, and everything else is sectioned with a colour section, everything is OK. The problem is, I want the advanced layer sliders in there as I can’t get the layout I want using regular sections. I’m going to have to do some hacking to see if I can find a work around.
In the mean time, it would be good if someone here could work out why the main menu ‘selected item’ highlight doesn’t play nice with the advanced slider.
Hi!
Thank you for using Enfold and for taking the time to investigate. I’m really sorry for the delay.
Have you tried the fix posted here? https://kriesi.at/support/topic/anchor-link-causing-navigation-bar-to-highlight-the-wrong-link/
Best regards,
IsmaelHi Ismael,
In the end, I re-did the page to remove the layer slider from the other places and stuck to just using the colored sections, which works fine. I didn’t try the specifics in the link you mentioned, but if I hit this issue again, I’ll see if it helps.
It all seems to work fine, it’s just that something causes problems if you have more than one advanced layer slider on the page.
Hey!
Thank you for pointing that out. Another user is having the same issue as yours. This thread might help.
Best regards,
IsmaelI Find the solution put this CSS and active color is work perfect
#top .sticky_placeholder {
height: 0px;
}
- You must be logged in to reply to this topic.