wordpress 中的下拉菜单关闭问题？

Question

我已经成功地在我自己的wordpress主题中将光标悬停到下拉菜单（点击"M"标志）时添加了过渡效果但是当光标远离下拉菜单时不不显示关闭时的过渡效果。您可以查看我自己的主题 on this link 了解更多信息。

这里下拉css样式：

.dropdown-menu {
    border-bottom-right-radius: 77px;
    border-bottom-left-radius: 77px;
    /* background: url(img/submenu.png) no-repeat scroll right/ 91% 100%; */
    position: absolute;
    height:0;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 153px;
    padding: 1px 0;
    margin: 2px 0 0 0;
    list-style: none;
    font-size: 14px;
    text-align: center;
    background-color: transparent!important;
    border: 1px solid #ccc;
    border: 1px solid rgba(0,0,0,0.15);
    background-clip: padding-box;
    opacity: 0;
    top: 35px;
    visibility: hidden;
    -webkit-transition:height 300ms ease-in;
    -moz-transition:height 300ms ease-in;
    -ms-transition: height 300ms ease-in;
    -o-transition:height 300ms ease-in;
    transition:height 300ms ease-in;
    overflow: hidden;
}

.navbar-nav li:hover .dropdown-menu {
    opacity: 1;
    top: 105px;
    visibility: visible;
     height:300px;
}

那么如何在下拉菜单关闭时添加过渡效果？

Answer 1

您可以尝试

而不是只转换高度

-webkit-transition: all 300ms ease-in;
-moz-transition: all 300ms ease-in;
-ms-transition: all 300ms ease-in;
-o-transition: all 300ms ease-in;
 transition: all 300ms ease-in;

wordpress 中的下拉菜单关闭问题？

drop-down menu closing issue in wordpress?

css

wordpress

wordpress-theming

twitter-bootstrap-3