带边距的下拉菜单
问题描述:
我有页面左上角的语言下拉菜单。问题是,当鼠标悬停在此边界上时,菜单向上滑动。有人能告诉我如何避免这种影响?这里是链接 - http://livedemo07682.prestatrend.com这里是代码:带边距的下拉菜单
//Block languages module
$('#languages_switcher').hover(function() {
$(this).find('#languages_block_top span').addClass('hover');
$(this).find('#first-languages').stop(true, true).slideDown(300);
}, function() {
$(this).find('#languages_block_top span').removeClass('hover');
$(this).find('#first-languages').stop(true, true).slideUp(150);
});
答
#first-languages_wrapper {
/* top: 1em Remove this line */
bottom: 4px; /* Add this one */
}
编辑:
这是怎么回事,因为边缘区域是#languages_switcher
边界之外。你有两个选择。
而不是
top: 1em
在你的菜单,把padding-bottom: 1em
在#languages_switcher
。在你的意见,我把它删除
top: 1em
与border-top: 1em solid transparent
答
阅读表明您希望从你的语言切换器是1EM下降,你的下拉菜单,虽然我看不出为什么,它看起来没有完善,并与其他导航栏不一致,但这里是一个修复。
而不是通过使用top:1em
删除您的子菜单只是用一些填充顶部,这样你可以沿着它的轴向下延伸容器,并且该边距下降不会影响悬停事件;
CSS
#first-languages_wrapper {
padding-top:1em;
}
虽然我会建议你通过top:100%
放下它,而不是,看起来更干净。
你说的是菜单和面板之间滑动的1em空间吗?然后,只需从#first-languages_wrapper删除“top:1em”在您的CSS – 2012-03-16 21:41:11
删除边距... – redDevil 2012-03-16 21:41:48
但我需要这个边距... – Anton 2012-03-16 21:45:20