Есть ли лучший способ сделать выпадающие меню в jQuery?

Я пытаюсь использовать jQuery's hover, чтобы сделать выпадающие меню. Итак, первое, что я пробую:Есть ли лучший способ сделать выпадающие меню в jQuery?

<ul id="menu"> 
    <li> 
    <ul> 
     ... 
    </ul> 
    </li> 
    ... 
</ul> 

$(" #menu ul ").css({display: "none", visibility: "hidden"}); 
$(" #menu li ").hover(function() { 
    $(this).find('ul:first:hidden').css(visibility:"visible", display:"block"}).show('fast'); 
    }, 
    function() { 
    $(this).find('ul:first').css({visibility:"hidden", display:"none"}); 
    });

и это отлично работает ... в Firefox. К сожалению, в версии Chrome я запускаю (9.0.597.94), если вы наводите курсор на это выпадающее меню, он выталкивает мышь на $ («# menu li #»).

Итак, у нас есть состояние гонки , все, что мне нужно сделать, это добавить некоторые таймеры ...

(function(){ 
var timer; 
$(" #menu li ").hover(function() { 
    $(this).find('ul:first:hidden').css(visibility:"visible", display:"block"}).show('fast'); 
    }, 
    function() { 
    var header = $(this); 
    timer = setTimeout(function() { 
     header.find('ul:first').css({visibility:"hidden", display:"none"}); 
     }, 100); 
    }); 
$(" #menu li > ul ").hover(function() { 
    clearTimeout(timer); 
    }, 
    function() { 
    $(this).css({visibility:"hidden", display:"none"}); 
    }); 
}();

Который работает реальный большой, пока кто-то говорит we need to put a textbox in that dropdown menu, и, конечно, текстовое поле вызывает мышь, чтобы огонь на $ (»#menu li> ul "), так что теперь мне нужно поставить еще один вложенный слой таймеров, и я думаю про себя: Должен быть лучший способ сделать это!

Таким образом, я надеялся, что кто-то может понять меня в ...

источник

2011-02-11 tzenes

Вопрос №1: Зачем вам текстовое поле в меню? –

@Paulo вы можете смело предположить, что все «дизайнерские» решения происходят на уровне, который у меня есть 0. Однако для меня это повторяющаяся проблема (выпадающие меню и таймауты), и было бы неплохо, если бы мне было проще создать эти меню. – tzenes

Есть ли причина, по которой вы не можете использовать Suckerfish (или быть софистическим Superfish)? Кажется, что это колесо, которое не нужно изобретать ...

источник

2011-02-11 01:06:54 peteorpeter

Я определенно хочу прекратить изобретать колесо, и мне понравилась идея Suckerfish (добавление состояния в DOM вместо JS); но есть ли способ применить этот подход ко всем децидентам? Сейчас это касается только детей, и мне нужны дети детей (и так далее ...). – tzenes

Вы хотите, чтобы все потомки открывались, когда вы нажимаете на родителя? Или вы хотите способность прогрессировать по одному слою за раз? Вот пример последнего в суперфишах: http://users.tpg.com.au/j_birch/plugins/superfish/#a. Первый потребовал бы немного дополнительного полоса ... – peteorpeter

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

В любом случае ... Думаю, вы можете посмотреть здесь: 38 jQuery and CSS Drop Down Multi Level Menu Solutions.

источник

2011-02-11 01:04:20

Я прошел через первую дюжину из них без какой-либо помощи для моего прецедента. Вы думаете, что могли бы быть более конкретными? – tzenes

Есть ли лучший способ сделать выпадающие меню в jQuery?

ответ

Смежные вопросы