帶邊距的下拉菜單

我有頁面左上角的語言下拉菜單。問題是，當鼠標懸停在此邊界上時，菜單向上滑動。有人能告訴我如何避免這種影響？這裏是鏈接 - 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

帶邊距的下拉菜單

回答

相關問題