Требуется помощь с подменю, время ожидания - PullRequest
0 голосов
/ 14 сентября 2010

Я работаю над этим меню для интранет-системы.У меня есть система меню, которая частично работает.

Я добавил код здесь: http://jsbin.com/eloxe3/8

Пункты меню со светло-серым фоном имеют подменю ... тогда как другиене делайте.Мне нужна помощь в исчезновении подменю после того, как я наведите курсор на ссылку без подменю в течение 1 секунды.

У меня есть эта функция, которая показывает подменю ... и я хочу, чтобы новый код следовал аналогичным принципам

$(".menu-arrow").hover(function(){
    $.data(this, "timer", setTimeout($.proxy(function() {
       $(this).click();
   },this),500));
},function(){
    clearTimeout($.data(this, "timer"));
});

... (Извините, пользователи этой интрасети новички ... на всякий случай, если они случайно перевернули ссылку)

Любая помощь ОГРОМНО ЦЕНА, спасибо

Ответы [ 2 ]

0 голосов
/ 14 сентября 2010

Взгляните на плагин hoverIntent .Он срабатывает только в том случае, если курсор находится над элементом.

var hideSubmenus = function () {
    $('.rtmenu').hide()
};

$(".no-submenu").hoverIntent({
    over: hideSubmenus,
    out: function () { /* do nothing */ }
});

Таким образом, подменю не будет скрыто, если они случайно переместят курсор из меню, а затем быстро вернутся снова, что частопроблема с подменю в моем опыте.

0 голосов
/ 14 сентября 2010

Глядя на источник, вы должны связать no-submenu с состоянием наведения.

$('.no-submenu').bind('mouseenter',function(){
    //at this point the mouse is over a link with no submenu.
    //So we close all submenus
    $('.rtmenu').hide().delay(1000);
})

Я не уверен, что задержка погоды будет работать с hide, но вы можете попробовать, если это не так, попробуйте следующее:

$('.no-submenu').bind('mouseenter',function(){
    //at this point the mouse is over a link with no submenu.
    //So we close all submenus

    var T = setTimeout(function(){
         $('.rtmenu').hide();
         clearTimeout(T);
    },1000)
});

Я могу ошибаться, но вы все равно можете это сделать.

небольшое обновление для clearTimeout

Попробуйте что-то вроде этого:

var _TimeOut;
$('.no-submenu').hover(,function(){
    var _TimeOut = setTimeout(function(){$('.rtmenu').hide();},1000)
},function(){
    clearTimeout(_TimeOut);
});

Только не то, что $('.rtmenu').hide(), возможно, должно быть $('.level2').hide(), и вам может быть немного лучше быть конкретным с .css('display','none')

Документы Hover здесь: http://api.jquery.com/hover/

...