Question

我有一个精灵图标，当它所在的div是鼠标悬停时会动画。该图标目前位于<span>卡中。

当我将鼠标悬停在<span>上时，我希望该图标能够生成动画，而不仅仅是当它悬停在图标上时。有没有办法做到这一点？

这是我正在处理的代码链接。 http://codepen.io/phantomboogie/pen/bwgNwq

这里是html和js

<span class="card">
<div class="icon book"></div>
</span>

<script>
var timer;
$(".book").mouseenter(function(){
        $(this).toggleClass('sprite_animating');
}) .mouseleave(function(){
    }) .on('animationend', function(){
$(this).toggleClass('sprite_animating');});
</script>

Answer 1

您只需要定位父Intl即可。如果父级有<div>课程，那么你会定位它。

.card

将函数中的$(".card").mouseenter(function(){ $(.book).toggleClass('sprite_animating'); })更改为要将“toggleClass”类添加到的类。

对于this函数也是如此。

Answer 2

你实际上只用CSS做这个，而且根本没有javascript（因为你正在使用CSS3动画）这个CSS规则

forwards

我添加了.icon，以便try { $userAttributes = [ "email" => $request->email, "access_token" => 'aaaa', "facebook_id" => 'bbbb' ]; $user = new User($userAttributes); $user->save(); }catch (Exception $e){}保持在动画的结束位置

将鼠标悬停在由父跨度触发的div上

2 个答案: