当前位置: 动力学知识库 > 问答 > 编程问答 >

css - HoverOut after transition

问题描述:

To witness the bug, hover on the right-side of the overlay box here (don't move your mouse even 1px after hovering):

http://jsfiddle.net/V99rf/

<style>

.container, .hoverMover {width:100px; height:100px; background:rgba(0,0,0,.2);}

.container {position:relative;}

.hoverMover {position:absolute; top:0; left:50px;}

.container:hover .hoverMover {background:green; left:0;}

.trans {-webkit-transition: all 1s ease-in-out; transition: all 1s ease-in-out;}

</style>

<div class="container">

<div class="hoverMover trans">

</div>

</div>

Notice that even after the dom element moves to the left, it remains green with a ":hover" being set. This gets unset as soon as you move the mouse. How do I make it unset when the dom element moves from under the mouse, even if the mouse isn't moved?

A recursive javascript timeout would be unsatisfying, but may be the only way...?

网友答案:

This is only possible with an event, so you will need some sort of iterative loop to accomplish what you are looking for.

分享给朋友:
您可能感兴趣的文章:
随机阅读: