Make multi level menu parents clickable / children show on hover

1

http://www.bootply.com/L0uiQc1FXX

Here is the structure of my menu, without posting all my compiled css and everything, just assume the multi level works like so… if you click the parent, it opens up the child up to 5 levels. That is NOT the issue.

What I would like it to do is open each child menu on hover.

If I add this, or similar css it opens up ALL children on hover.

.dropdown:hover .dropdown-menu {
display: block;
}

Does anyone have a solution for this?

2

This isn’t a Roots issue, it’s a Bootstrap issue. A quick Google search turned this up: http://simonpadbury.com/bootstrap-3-navbar-dropdown-hover/

3

Since roots controls bootstrap I asked in Roots incase there was an easy fix/function etc. Thank you for the link, and I searched Google a lot, I guess just not for the right thing.

A smaller issue, is that my multi level menu parents do not collapse when clicking, this fix might take care of that with the hovering. But incase not, any insight on that?

4

My insight is that you’re bucking a significant development trend which Bootstrap bought into and then you’re creating a hybrid methodology so expect it to be a bit of a ride.

Google it some more; it’s not Roots related and so is outside the scope of this forum.