By default, if you stop hovering over an element, the transitioning of any properties will stop as well. Simple example:
li {
position: relative;
transition: 1s;
left: 0;
}
li:hover {
left: 20px;
}
<ul>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
</ul>
尝试快速将指针从列表顶部到底部移动,元素几乎不会移动。我希望实现一种转换行为,一旦开始,就会被带到结束。我正在寻找纯CSS解决方案。
css
无法实现这个,因此我添加了一个结合javascript
的示例。 - prettyInPink