css3 过渡延迟仅在一段时间后才会启动动画。 没关系。 但动画仅与它相关。
当鼠标悬停在子div上时,我们可以在2秒后更改其Z指数吗?
我做过的事情:
<div class="parent">
<div class="front"></div>
<div class="back"></div>
</div>
<style>
.parent:hover .front{
transition-delay:4s;
/* Safari */
-webkit-transition-delay:4s;
z-index: -1;
}
</style>
此版本应该适用于所有现代浏览器:http://jsfiddle.net/maximgladkov/aLEgJ/
.HTML
<div class="parent">
<div class="front"></div>
<div class="back"></div>
</div>
.CSS
.parent .front {
z-index: 1;
}
.parent .back {
z-index: 0;
}
.parent:hover .front {
-webkit-transition-delay: 4s;
-moz-transition-delay: 4s;
-ms-transition-delay: 4s;
-o-transition-delay: 4s;
transition-delay: 4s;
z-index: -1;
}