我想在鼠标移出事件开始CSS转换之前应用延迟。我的CSS代码如下，请让我知道如何在CSS过渡之前应用时间延迟。我想在css中应用延迟鼠标输出

我想要在用户将鼠标指针移出菜单之后，菜单保持稳定一段时间(例如3秒)。

.timnav li .dropdown {

width: auto;

min-width: 0px;

max-width: 230px;

height: 0;

position: absolute;

overflow: hidden;

z-index: 999;

background:rgba(255, 255, 255, 0.8);

}

.timnav li:hover .dropdown {

min-height: 60px;

max-height: 500px;

height: auto;

width: 100%;

padding: 0;

-webkit-transition: delay .5s ease-in-out;

-moz-transition: delay .5s ease-in-out;

-o-transition: delay .5s ease-in-out;

}

.timnav li .dropdown ul {

margin: 0;

margin-top:7px;

}

.timnav li .dropdown ul > li {

display: block;

width: 100%;

float: left;

text-align: left;

height: auto;

border-radius: none;

padding-bottom:2px;

}

.timnav li .dropdown .dropdown2{

display: none;

width: 100%;

float: left;

text-align: left;

height: auto;

border-radius: none;

}

.timnav li .dropdown ul > li:hover .dropdown2{

display: block;

width: 100%;

float: left;

text-align: left;

height: auto;

border-radius: none;

}

.timnav li .dropdown .dropdown2:hover {

display: block;

width: 100%;

float: left;

text-align: left;

height: auto;

border-radius: none;

}

.timnav li .dropdown .dropdown2 li a {

display: block;

padding-left:7px !important;

height:6 !important;

padding-top:8px;

background: url(../images/nav-bg.jpg) repeat; color:#fff;

}

.timnav li .dropdown ul > li a {

display: block;

line-height: 26px;

height: 22px;

padding: 10px;

background: url(../images/nav-crrent.jpg) repeat; color:#FFFFFF;

}

.timnav ul .dropdown ul li:first-child a {

border-radius: 0;

}

.timnav li .dropdown li a:hover {

background: url(../images/nav-bg.jpg) repeat; color:#000;

}

2013-04-24

Tim John