悬浮动画如何停止？

Question

有没有办法阻止悬浮动画悬停？

:hover

下面是一个显示动画的链接：

https://codepen.io/youbiteme/pen/RprPrN

Answer 1

只需向svg悬停添加一个动画暂停即可

.svg:hover .shaddow,
.svg:hover .right-movment,
.svg:hover .left-movment,
.svg:hover .leon
{
    -webkit-animation-play-state: paused;
    -moz-animation-play-state: paused;
    -o-animation-play-state: paused;
     animation-play-state: paused;
}

更新钢笔

Answer 2

.leon:hover {
    animation: none;
}

可能就是你要找的。

Answer 3

你可以试试这个悬浮法：

.svg:hover .leon {
    -webkit-animation-play-state: paused; /* Safari 4.0 - 8.0 */
    animation-play-state: paused;
    cursor: pointer;
}

对所有人而言：

.svg:hover .leon,
.svg:hover .right-movment, .svg:hover .left-movment, .svg:hover  .shaddow {
    -webkit-animation-play-state: paused; /* Safari 4.0 - 8.0 */
    animation-play-state: paused;
    cursor: pointer;
}