所以,我有一个简单的菜单:当您单击一个时显示一个项目,当您单击两个时显示两个项目。 “一”和“二”具有切换功能,因此它们在单击时会向下和向上滑动,但是当我在不关闭“一”的情况下切换“二”时,事情会变得困惑。
$(function() {
$('li.sub', '#navigation').each(function() {
var $li = $(this);
var $div = $('div.submenu', $li);
var top = $li.height();
$li.toggle(function() {
$div.css('top', top).
slideDown('slow');
},
function() {
$div.
slideUp('slow');
});
});
});
fiddle :http://jsfiddle.net/vGSWm/2/
最佳答案
你可以试试这个
$(function() {
$('#navigation li.sub').click(function(e) {
var el = $(this).find('.submenu');
$('.submenu').not(el).slideUp(function(){
el.slideToggle();
});
});
});
更新:
$(function() {
$('#navigation li.sub').click(function(e) {
var el = $(this).find('.submenu');
if(el.hasClass('open'))
{
el.slideUp(function(){
el.removeClass('open');
});
}
else
{
var opened = $('.submenu.open');
if(opened.length)
{
opened.slideUp(function(){
opened.removeClass('open');
el.slideToggle(function(){
el.addClass('open');
});
})
}
else
{
el.slideToggle(function(){
el.addClass('open');
});
}
}
});
});
DEMO .
关于Jquery 点击下拉菜单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15058159/