Not all menu anchor links working correctly

[andyw22801977]

I am having problems with the hyperlinks in my menu

I have 7 menu links that link to anchors down my page.

However, in Preview mode the first four items work correctly and the last three appear to not be linked. There is no hover state or anything and I am unable to click them. When I publish the page and get it up on my server, the first two items and last two items work correctly, and the middle three appear to not be linked. I don't get it. It seems random. I've triple checked everything and all the links are in there correctly. And I've deleted and re-added the menu items thinking that would help. It doesn't. I've arranged the menu bar to the front so nothing else is over top of it.

Here is my website as it is right now:

Three Eagle Half Marathon & 5K

I get the same behavior in other browsers. I cannot check it in other operating systems, as I only have access to Mac machines.

Can anybody shed some light on this? I need to get these links working!

[fotoroeder]

It seems, that something is covering the menu items.

Kind Regards,

Uwe

[andyw22801977]

That's what I would've guessed too, so I arranged the menu so it was in front.

Is there another way to ensure that it is in front?

[Günter Heißenbüttel]

Could you do this:

• To keep your Muse file small and handy to analyse, please delete all images.
• Save the file under a new name.
• Upload it to Dropbox, CC Files or a similar file sharing service.
• Post the download link here.

Then we will have a close look.

[andyw22801977]

I can send a link to the Muse file tomorrow if I get the time. I'll try and remember.

Are you seeing the same behavior I'm describing on your machines?

Even when I open the published HTML files in something else (like Dreamweaver), the menu navigation works as it should in the Dreamweaver preview. All the hover and click states are correct and each of the 7 menu items links to its corresponding anchor tag. However, opening it in any various browsers on my Mac doesn't work. As I said, in Preview mode in Muse, the first four items work correctly and the last three appear to not be linked. There is no hover state or anything and I am unable to click them. When I publish the page and get it up on my server, the first two items and last two items work correctly, and the middle three appear to not be linked. I can't figure out what would cause that odd behavior, where it displays the menu navigation links differently depending on what you're viewing it in?

But I'll try and remember to send the Muse file tomorrow.

[fotoroeder]

In this area …:

… the rollover state and so the links do not work. You can take care of that, if you place the menu on master page on/in the top layer on top of every element. Hope that helps, otherwise follow Günter Heißenbüttel​ advice, please.

Kind Regards,

Uwe

[Günter Heißenbüttel]

andyw22801977  schrieb

I'll try and remember to send the Muse file tomorrow.

If you don’t remember, the issue can’t be THAT hard for you …

[andyw22801977]

So it does seem to be a problem with the layers and what is in front.

Here are the items at the top of my page:

The orange shape on the left with the birds, and the menu text links are on the same layer, listed as "HOME." The orange shape on the right, with the navigation is on a layer listed as "MENU." Whether they are all on the same layer or not doesn't seem to matter. The only thing that matters is if the right navigation is on top of the text links. If that orange right-hand navigation is on top (which it should be), then the text links don't function correctly. If the text links are on top of the orange right-hand navigation, then those text links work like they should. However, they render differently AND they float on top of that right-hand menu, which won't work.

So, my dilemma is that I need to get the menu text links on the very top of everything, except the orange right-hand navigation. That navigation should be pinned to the top right of the page at all times. But when it's on top, the menu text links don't work.

That's as much as I could figure out this morning.

Any suggestions?

[Günter Heißenbüttel]

No suggestions without .muse file.

If you really want help, don’t make us feel like a beggar.

[fotoroeder]

Follow Günter Heißenbüttel​ advice and/or take care that the menu is on the master page on top layer and on top of the top layer.

Kind Regards,

Uwe

[andyw22801977]

I've put the Muse file on Dropbox here:

https://www.dropbox.com/s/z7tl4y7dn5h71q8/EDITCOPY.muse?dl=0

I've removed many images, but left the background images in because I wasn't sure if that had any bearing on the layout.

I tried putting that orange right-hand navigation on the Master page, but it didn't make a difference.

If you need anything else, let me know.

[fotoroeder]

If you follow my advice from my second post and place the menu on your master how I did it here: https://adobe.ly/2NSMQm6 ​

First you must set up the breakpoint properties the same way you did with your page. That´s a good advice anyway.

You may see in the layers palette "my" setup on your master page where I put the menu on top of the layers palette and called it MASTER MENU

Best Regards,

Uwe

[andyw22801977]

I moved the text menu to the Master. That seemed to work for the most part. Thank you.

However, any time I try to pin that orange right-hand navigation to the top of the page, the text menu reverts back to it's odd behavior. It's like that text menu cannot handle being under anything else. Ideally, I'd like that orange right-hand navigation to float on top-right of the entire page when scrolling. Is it possible to keep the text menu on top AND pin that orange right-hand navigation?

[fotoroeder]

Of course this is possible, you may download ma version of your file here:  https://adobe.ly/2NSMQm6​

You may need a breakpoint at 1170 and the menu must be hidden in that breakpoint, of course, what I did.

Does this help?

Let me add, that I put the top three elements on master in order to keep them organized.

Kind Regards,

Uwe

[andyw22801977]

I'm still not getting the behavior I want.

As you can see below, I need that right hand navigation to pin to the top right of the page so it's always on top of every element and stays in the upper corner, even when I scroll. The problems is that when that navigation is on the top layer, or pinned to the top, the text navigation doesn't work. When the text navigation is on top, then it works correctly! But then it's on top of the right-hand navigation.

Like I said, it's like they both need to be the very top element in order for them to work.

Does that make sense?

[andyw22801977]

Günter Heißenbüttel​ fotoroeder​

Any ideas or suggestions on that last post I made?

[Günter Heißenbüttel]

Give us a new .muse file, containing nothing(!!!) except the two menus and we will see …

[fotoroeder]

I agree.

BTW, I think you must use breakpoints. As soon as the design doesn`t work/function anymore, you should use another design in that new breakpoint.

Kind Regards,

Uwe

[andyw22801977]

Here's the MUSE file with only the top navigation.

I am not using breakpoints because I have separate layouts set up for Tablet and Mobile that display upon device detection. I haven't had any other problems other than this pesky navigation on the desktop layout.

Dropbox - TEST.muse

[Günter Heißenbüttel · Accepted solution]

Set the composition menu from „Scattered“ to „Stacked“ and all should work as expected.

Besides that: Are you aware, that your layout page width is fixed (master bp is responsive) at 1170 px? The 1370 px is no breakpoint it is the browser background representation.

[andyw22801977]

Thank you Günter Heißenbüttel​ and fotoroeder​ for all your help!

All my issues have been resolved. Job well done.