0

我对 jQuerymouseenter和mouseout(and mouseleave) 有疑问。我的代码如下：

$('nav#mainMenu ul li:not(:first), nav#mainMenu ul li ul:not(li a)').each(function() {
    $(this).mouseenter(function() {
        $(this).children('a').addClass('active');
        var left = $(this).outerWidth(true),
            width = 0;
        if($(this).hasClass('help')) { // IF HELP
            $(this).prevAll('li').each(function() {
                width += $(this).outerWidth(true);
            });
        } else { // ELSE
            $(this).nextAll('li').each(function() {
                width += $(this).outerWidth(true);
            });
        }

        var width = width + 1;

        if($(this).hasClass('help')) {
            $(this).children('ul').css({ 'right':left, 'width':width });
            $(this).children('ul').stop().show('slide', { direction: 'right' }, 250);
        } else {
            $(this).children('ul').css({ 'left':left, 'width':width });
            $(this).children('ul').stop().show('slide', { direction: 'left' }, 250);
        }
    });
        $(this).mouseout(function() {
        if($(this).hasClass('help')) {
            $(this).children('ul').stop().hide('slide', { direction: 'right' }, 250, function() {
                $(this).parent('li').children('a').removeClass('active');
            });
        } else {
            $(this).children('ul').stop().hide('slide', { direction: 'left' }, 250, function() {
                $(this).parent('li').children('a').removeClass('active');
            });
        }
    });
});

当我在动画结束时停留在光标上时，效果很好，但如果我离开中间，mouseout不会被触发并且children('ul')仍然可见。有任何想法吗？

编辑：问题显然是由使用 jQueryUI 引起的slide，而不是“基本”jQuery 方法。唯一的问题是 - 它可以以某种方式修复吗？

4

1 回答 1

-1

将鼠标放在一个功能上，然后将鼠标移出，例如....

$('nav#mainMenu ul li:not(:first), nav#mainMenu ul li ul:not(li a)').each(function() {
    $(this).hover(function() {
        $(this).children('a').addClass('active');
        var left = $(this).outerWidth(true),
            width = 0;
        if($(this).hasClass('help')) { // IF HELP
            $(this).prevAll('li').each(function() {
                width += $(this).outerWidth(true);
            });
        } else { // ELSE
            $(this).nextAll('li').each(function() {
                width += $(this).outerWidth(true);
            });
        }

        var width = width + 1;

        if($(this).hasClass('help')) {
            $(this).children('ul').css({ 'right':left, 'width':width });
            $(this).children('ul').stop().show('slide', { direction: 'right' }, 250);
        } else {
            $(this).children('ul').css({ 'left':left, 'width':width });
            $(this).children('ul').stop().show('slide', { direction: 'left' }, 250);
        }

        ,function() {
        if($(this).hasClass('help')) {
            $(this).children('ul').stop().hide('slide', { direction: 'right' }, 250, function() {
                $(this).parent('li').children('a').removeClass('active');
            });
        } else {
            $(this).children('ul').stop().hide('slide', { direction: 'left' }, 250, function() {
                $(this).parent('li').children('a').removeClass('active');
            });
        }
    });
});
于 2013-01-09T10:50:57.493 回答