-1
我正在尋找一個簡單的JavaScript或一些CSS下拉菜單,就像谷歌搜索結果。點擊時的小箭頭顯示「緩存」,「類似」選項。谷歌搜索結果樣式下拉按鈕
我正在尋找一個簡單的JavaScript或一些CSS下拉菜單,就像谷歌搜索結果。點擊時的小箭頭顯示「緩存」,「類似」選項。谷歌搜索結果樣式下拉按鈕
的基本原理是很容易的,但你可以從這裏開始,並使其更美觀,更好的UI體驗:
<div class="button">
<span class="dropdown-button-text">Dropdown</span>
<div class="popup">
Popup content
</div>
</div>
<style type="text/css">
.button { position: relative; display: inline-block; min-width: 100px; }
.popup { position: absolute; top: 100%; left: 0; display: none; min-width: 300px; min-height: 50px; border: 1px solid #9F9F9F; }
</style>
<script>
$("body").delegate(".dropdown-button-text", "click", function() {
var popup = $(this).parent().children(".popup");
if (popup.is(":visible")) {
popup.hide();
} else {
popup.show();
}
});
</script>
你嘗試過這麼遠嗎?你有什麼CSS或甚至一些HTML標記,你可以告訴我們合作? – 2013-04-27 08:25:19