test ==== gt; test lt;br/gt; test一个绝对定位，一个是固定定位。。。fixed在ie6下不支持。。。。

$(document).ready(function () {
   var sub = $("#sub");

   var activeRow, activeMenu;

   $("#test").on("mouseenter",function (e) {
       // sub.removeClass("none");
   }).on("mouseleave",function (e) {
       sub.addClass("none");

       if(activeRow){
           activeRow.removeClass("active");
           activeRow = null;
       }

       if(activeMenu){
           activeMenu.addClass("none");
           activeMenu = null;
       }
   }).on("mouseenter","li",function (e) {
       sub.removeClass("none");
       if(!activeRow){
           activeRow = $(e.target).addClass("active");
           activeMenu = $("#" + activeRow.data('id'));
           activeMenu.removeClass("none");
           return;
       }

       activeRow.removeClass("active");
       activeMenu.addClass('none');

       activeRow = $(e.target);
       activeRow.addClass("active");
       activeMenu = $("#" + activeRow.data('id'));
       activeMenu.removeClass("none");
   });
});

这个其实也不算什么bug，你看到的空子菜单实际上就是它的padding造成的，你可以把padding这个css样式命令剥离出来，在鼠标移入li时addClass，移出li时removeClass。第二种方法比较简单，看图：

把那行代码写过来

$("#text")包含内层的ul，还有li，，，进入ul还没进入li时，也会触发下面的.on("mouseenter",function(e){
sub.removeClass("none")})，使得会出现#sub的样式，这个bug看着很难受，直接写成$("#text li")就行，让他进入Li触发，不过后面的事件委托的时候.on("mouseenter","li",function(e)前面就得加上$("#text")或者$("#text ul") 毕竟$("#text li")不能委托自己。小BUG完美解决。体验感好些了。

这是我的解决方案https://github.com/keyiwu/JD-Menu/releases/tag/1.1.1

还是不行，绑定li的话，离开一级菜单到二级菜单的时候，二级菜单会隐藏

我知道了，要绑定到li上

$('#test li')