当您进入网站时，如何使下拉菜单不消失？

Question

当您进入我的网站（goerann.com）时，默认情况下下拉列表框处于关闭状态。

如果单击“ 注册” ，则注册框会根据需要切换其可见性，但默认情况下不会开始隐藏。

$(document).ready(function() {
  $('#signup').click(function() {
    $('.signupmenu').slideToggle("fast");
  });
});

我希望它仅在您单击时显示。 我怎样才能做到这一点？

这是我的jsfiddle（ http://jsfiddle.net/bdv2doxr/ ）

Answer 1

由于您已经在使用$(document).ready事件，因此可以在此处隐藏菜单：

$(document).ready(function() {
  $('.signupmenu').hide();
  $('#signup').click(function() {
    $('.signupmenu').slideToggle("fast");
  });
});

这是您的小提琴更新 。

Answer 2

您需要进行两项更改，都涉及删除display：block。 切换此div时，它将显示该块。 因此，您可以将其初始化为display：none。

更改此：

<div class="signupmenu" style="display: block;">

对此：

<div class="signupmenu">

并更改此：

.signupmenu {
    background-color: #FFF;
    display: block;
    ...

对此：

.signupmenu {
    background-color: #FFF;
    display: none;
    ...

在这里更新小提琴