Collapse button not working, hover on desktop, click on narrow view

[boilerroomdigital]

Menu working well, but I”m having a couple of issues. Basically, I’d like my menu to work pretty much as the one on the smartmenus site does at the moment…

– I want to have submenus appear on hover when I’m in a wide browser window as they do now, but when I narrow my browser, I want submenus only to appear on click, not hover. (I know this works OK on touch devices, but I want to emulate this behaviour on desktops with narrow browser windows).

– The “Expand/Plus” icon correctly changes to a minus when the child submenu is expanded, but it doesn’t do anything to collapse the menu – clicking it just activates the link that it’s inside of. How can I make it so that a click on the collapse icon hides the submenu?

– Is it possible to have a click on the top level menu item just go to that page, but only expand the menu when clicking on the “Plus” (in mobile mode)? (Less crucial, but that may be the behaviour the client wants.

[admin]

From what I understand, 1) and 2) work exactly as you would like by default:

http://vadikom.github.io/smartmenus/src/demo/

so I am not sure what might be wrong for you. Maybe you’ve used some custom CSS that breaks the features but I will need to look at your code to be able to tell for sure.

About 3) you could use a small mod posted here:

http://www.smartmenus.org/forums/topic/href-not-working-on-parent-as-expected/#post-3025

[boilerroomdigital]

Thanks – yes, the demos work as I want them to.

Here’s the site:
http://www.bsgc.org.uk/welcome.htm
if you are able to have a quick look.

I’ve been retrofitting the menu to an existing site which someone else built, which is perhaps why it’s difficult.

[admin]

Sorry for this late reply! To fix the issue remove the following rule:

	#main-menu ul{
		position: relative;
	}

from your CSS file:

http://templates.livesiteadmin.com/css/c5a255f7-4ef8-4a7f-8387-8529c0f0b624.css?d=2016-05-13-1621

This custom rule breaks the SmartMenus feature that detects when the menu is in collapsible (mobile) mode.

[Author]

Posts