带边距的下拉菜单

我有页面左上角的语言下拉菜单。问题是，当鼠标悬停在此边界上时，菜单向上滑动。有人能告诉我如何避免这种影响？这里是链接 - 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); 
    });

来源

2012-03-16 Anton

你说的是菜单和面板之间滑动的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

#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

来源

2012-03-16 21:42:38 elclanrs

不，我需要这个边距我需要一个下拉从橙切换器。 – Anton 2012-03-16 21:45:02

货币菜单有这个......为什么你需要保证金我不明白>？ – elclanrs 2012-03-16 21:45:54

不，我不需要它像在货币我需要它像现在在语言一点点下降1em在我的情况... – Anton 2012-03-16 21:47:31

添加填充替换它的元素

#languages_switcher { 
    float: left; 
    margin-left: -1px; 
    padding-bottom: 1em; 
}

来源

2012-03-16 21:52:18

但是在这种情况下，当它在#languages_switcher上徘徊时，它下面的空间 1em下拉将滑下...不好看... – Anton 2012-03-16 21:55:15

呵呵？我不明白。 – 2012-03-16 21:59:57

在这种情况下，只需将鼠标悬停在#languages_switcher下方，即可看到该菜单向下滑动。 – Anton 2012-03-16 22:09:31

阅读表明您希望从你的语言切换器是1EM下降，你的下拉菜单，虽然我看不出为什么，它看起来没有完善，并与其他导航栏不一致，但这里是一个修复。

而不是通过使用top:1em删除您的子菜单只是用一些填充顶部，这样你可以沿着它的轴向下延伸容器，并且该边距下降不会影响悬停事件;

CSS

#first-languages_wrapper { 
    padding-top:1em; 
}

虽然我会建议你通过top:100%放下它，而不是，看起来更干净。

来源

2012-03-16 22:19:46

是的，它看起来更干净，但在填充顶部之后并没有清理干净：1em在#languages_switcher下面有一个空格，如果你将鼠标悬停在它下面的空白处，菜单会滑下来，它不是很好看，你明白吗？ – Anton 2012-03-16 22:24:41

我认为最好的方法是让你稍微瘦一点时间瘦人？ – Anton 2012-03-16 22:28:59

@Anton刚刚注意到，可以通过在'＃languages_switcher' div底部使用负边距来移除额外的填充位，如下所示：'margin-bottom：-1em'。 – 2012-03-16 22:33:41

带边距的下拉菜单

回答

相关问题