带有子菜单悬停的 Jquery 菜单

问题描述

我有一个不言自明的菜单和子菜单系统，您将鼠标悬停在主菜单选项中的某些内容上，然后您会看到一个选项子菜单.

I have a menu and sub-menu system which is self explanatory, you hover over something in the main menu options and then you are presented with a sub menu of options.

如果您将鼠标悬停以查看主菜单选项，但随后鼠标离开而未从子菜单中进行选择，则会出现问题，子菜单不会向上滑动.

There is a problem if you hover to see the main menu options, but then mouse away without selecting from the sub menu, the sub-menu doesn't slide up.

你可以看到它在这里工作(我知道 css 很臃肿，但我刚刚复制了整个工作表:

You can see it working here (I know the css is bloated but I have just copied the entire sheet in:

http://jsfiddle.net/6sres/

这是我正在使用的 Jquery:

This is the Jquery I am using:

$('#nav li').hover(

     function () {
          //show its submenu
          $('ul', this).stop().slideDown(100);
     },

     function () {
          //hide its submenu
      $('ul', this).stop().slideUp(10);
     }

);

$('a#leagueSelect').hover(function(){

     $('ul.fixture-list').slideDown(50);

});

我知道这很简单，可能与导致一些问题的this"有关.

I know it is something simple, perhaps related to the "this" which is causing some issues.

谢谢，

艾伦.

推荐答案

当 a#leagueSelect 不再悬停时，您没有创建任何处理事件的函数.

You didn't make any function that handles the event when a#leagueSelect is not hovered anymore.

$('a#leagueSelect').hover(function(){
     $('ul.fixture-list').slideDown(50);
},
function(){
     $('ul.fixture-list').slideUp(50);
});

这篇关于带有子菜单悬停的 Jquery 菜单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！