Please help me solve the following error when I hover over the main menu the submenu dropdown won't show.
The HTML looks like this:
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown"
role="button" aria-expanded="false">
Page<span class="caret"></span>
</a>
<ul class="dropdown-menu" role="menu">
<li><a href="404.html">404 Page</a></li>
<li><a href="#">Link Two</a></li>
<li><a href="#">Link Three</a></li>
</ul>
</li>
Javascript code is the following:
$('ul.nav li.dropdown').hover(function() {
$(this).find('.dropdown-menu').stop(true, true).delay(200).fadeIn(200);
}, function() {
$(this).find('.dropdown-menu').stop(true, true).delay(200).fadeOut(200);
});
$(document).ready(function() { $( '.dropdown' ).hover( function(){ $(this).children('.dropdown-menu').slideDown(200); }, function(){ $(this).children('.dropdown-menu').slideUp(200); } ); }); // end ready
.dropdown-menu { display:none; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"> Page<span class="caret"></span> </a> <ul class="dropdown-menu" role="menu"> <li><a href="404.html">404 Page</a></li> <li><a href="#">Link Two</a></li> <li><a href="#">Link Three</a></li> </ul> </li>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.