I’ve built a menu with several items in it, the first two “ENGINEERING” and “DEVELOPMENT” contain sub-menus that on hover are supposed to slideDown and on hover-out supposed to slideUp.
<script>
$(document).ready(function(){
$("nav ul.first-halve > li:first-of-type").hover(
function(){
$('.sub-menu.eng').slideDown('medium');},
function(){
$('.sub-menu.eng').slideUp('medium');}
);
$("nav ul.first-halve > li:nth-of-type(2)").hover(
function(){
$('.sub-menu.dev').slideDown('medium');},
function(){
$('.sub-menu.dev').slideUp('medium');}
);
});
</script>
There is some weird behavior though; when I hover over the edges of some of the sub-menu items, like near the bottom of ENGINEERING > MECHANICAL, the sub-menu begins to open and close by itself without any mouse movement. See video of what I’m talking about, https://www.youtube.com/watch?v=W7zVacv8anQ
Anybody know what’s up? Thanks!