javascript - Bootstrap: on hover in Dropdown menu parent menu highlighted -


I found the solution here:

I'm fixing the bootstrap NAV , I've customized it a little bit, so instead of clicking on the menu, hover it over the menu.

This is the code I added:

  ul.nav li.dropdown: hover & gt; Ul.dropdown-menus {display: block; }  

And this is the structure of HTML:

   

When the parents are hive on the menu, it shows the menu below, but when I go to the sub menu parent menu hover state, then in that case should be selected. Can someone please implement me in Bootstrap 3.0?

Try it with Javascript:

  $ (document) .ready (function () {$ (". Dropdown "). Hover (function () {$ ('. Dropdown-menu', this). Stop (true, TrueDown ("sharp"); $ (this) Toggle class ('Open');}, function () {$ ('. Dropdown-menu', this). Stop (true, true) .SlideUp ("Fas T "); $ (This) .toggleClass ('open');});});  
  & lt; Link href = "// maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel = "stylesheet" /> & Lt; Script src = "https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js" & gt; & Lt; / Script & gt; & Lt; Script src = "// maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script> & Lt; Li class = "dropdown" & gt; & Lt; A href = "#" class = "dropdown-toggle" data-toggle = "dropdown" roll = "button" aerial-expanded = "wrong" & gt; Top menu & lt; / A & gt; & Lt; Ul class = "dropdown menu" & gt; & Lt; Li & gt; & Lt; A href = "submenu.php" & gt; Submenu & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "submenu.php" & gt; Submenu & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "submenu.php" & gt; Submenu & lt; / A & gt; & Lt; / Li & gt; & Lt; / Ul & gt; & Lt; / Li & gt;  


Comments

Popular posts from this blog

python - Overriding the save method in Django ModelForm -

html - CSS autoheight, but fit content to height of div -

qt - How to prevent QAudioInput from automatically boosting the master volume to 100%? -