I have a tricky one here…I have a menu with various subsections that you just hover to get around… however, some users are clicking the menu sections and this causes a flashing bug… can anyone advise on how I can stop this from happening?
camlingroup . com
e.g. click hover over products and then click on low voltage and you will see it causing some sort of conflict, means users cant go beyond this area until they click again.
It seems like your custom .hover() handler clashes with the default bootstrap dropdown behavour; it also inverts the hover effect when clicked, since you just .toggle() that open class regardless of whether the dropdown is already open or not. I think the easiest fix would be to use CSS for the hover effect, and the bootstrap JS for the default click behaviour only – i.e.
PS: I have to say that I find applying both hover and click behaviour a bit confusing though… like when you click-open a dropdown, you can still open other dropdowns by hovering them, which looks kinda inconsistent.
Sure, simply don’t load the bootstrap dropdown plugin. ;-) If you still need the dropdown plugin somewhere else, you can remove the data-toggle attributes which are the primary interface to control the plugin. Or you can turn off that API programatically as explained in the docs: