-1

我正在为下拉菜单寻找一个简单的 JavaScript 或一些 CSS,就像 Google 搜索结果中的那个一样。单击时的小箭头显示“缓存”、“类似”选项。

在此处输入图像描述

4

1 回答 1

1

基本实现非常简单,但你可以从这里开始,让它看起来更漂亮,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>
于 2013-04-27T08:26:55.870 回答