Mobile Menu is duplicated

[mbarrington]

Hi! The mobile menu on my client's header has undergone some strange transformations. It's now appearing twice, and is transparent except on mouse over (I thought it was gone completely until I used Chrome's Dev Tools). The icon image it's trying to link to is also now a dead link. Does anyone familiar with mobile menus have an idea as to how to fix this, or otherwise alternate suggestions for implementing a well-behaved mobile menu in Hubspot? 

http://learn.illinoiseyecenter.com/lasik-promo-2017?hs_preview=gxsYABpz-5328145791

[edjusten]

Hi @mbarrington Would it be possible to forward some screenshots of the issue? If you don't to show your web page publiclly yet, you can forward in a PM.

Ed

INBOUND 2017 is just around the corner. Find out more at inbound.com or check out the post on the main Community page and check out the upcoming AMA with Deb Calvert. 

[mbarrington]

Hi, there! Apologies if my previous link didn't work. 

Here's the live URL: http://learn.illinoiseyecenter.com/lasik-promo-2017

Does that help? 

[edjusten]

Hi @mbarrington Still a bit confused here. The link is to a landing page, which doesn't traditionally have a menu. The page you linked though, does have a menu in mobile mode, however it is very tiny and at the top of the page. It most likely would not be recognized as a menu by most users.

When you tap the menu on the landing page, it takes you to http://www.illinoiseyecenter.com/ which has the standard hamburger menu in the upper left corner. 

Can you clarify a bit further the issue you are seeing? Screenshots would be helpful also. 

Thanks!

Ed

[mbarrington]

Thanks for hanging with me! 

I realized that the menu issue was only appearing in 480px - 767px. Below that, the menu was set to display:none, which I corrected. The screen shots have been taken at the size range mentioned above, but you can also find the menu at smaller sizes now as well. 

As a side note, we do have navigation on our thank you pages and blog pages that are in Hubspot, so they integrate seamlessly with the rest of the website which is in Wordpress. The icon you clicked on was simply the website's logo, which took you to the main website and your screenshot showed the menu that is on the Wordpress site. My apologies for not explaining that more clearly before. Again, here is a link that will show the menu in question: 

http://learn.illinoiseyecenter.com/lasik-promo-2017

The issue is that the navigation is invisible until you mouse over the white area to the left of the logo. On mouse over, you see two black squares. In my screenshot, the right square is a working mobile menu, while the left square appears to be a dead duplicate. I could get the menu to appear again (on the "up" state) using CSS, however I'm not familiar with how to remove the duplicate. I'd also like some guidence on how to get the "hamburger icon" properly linked to this button, if you know offhand! It used to be on there, but the link is broken now. 

I appreciate your time and help!