我正在使用CSS在鼠标悬停时旋转一个对象,并希望该对象在取消悬停时保持在其新位置。我已经搜索过了,但是我只找到了一个似乎超出范围的链接:css :hover rotate element and keep the new position。
这种效果是否可能仅通过CSS实现?我希望当你停止悬停时图标仍然保持在180度的位置。
我使用了以下代码:
这种效果是否可能仅通过CSS实现?我希望当你停止悬停时图标仍然保持在180度的位置。
我使用了以下代码:
i.fa.fa-globe:hover {
color: #e9204f;
transition: 0.9s;
transform: rotatey(180deg);
}
此外,如果这个图标使用了font-awesome字体库,那么这也可能对后续操作产生影响。
编辑 - 对于其他需要解决此问题的人来说,以下是一个简单的CSS解决方案(摘自评论):
.lovernehovermarket i.fa.fa-rocket {
transform: rotate(0deg);
transition: transform 999s;
}