FontAwesome图标里面的锚不在铬上动画

我试图在一个范围内工作正常，但是当我把图标放在一个锚中时，它停止在Chrome上工作，在IE上它工作的一个fontawesome图标。FontAwesome图标里面的锚不在铬上动画

我使用FontAwesome 3.2.1 ，这是我的代码

HTML：

<a> 
    <i class="icon-wrench rotator"></i> 
</a>

CSS：

.rotator { 
    display: inline-block; 
    -webkit-animation: rotate 2.5s 4 ease; 
    -webkit-transform-origin:90% 35%; 
} 

@-webkit-keyframes rotate { 
    from { 
     -webkit-transform: rotate(-12deg); 
    } 

    to { 
     -webkit-transform: rotate(112deg); 
    } 
}

我FontAwesome 3.0.2尝试过了，它的工作原理，当我升级到3.2.1时，至少在Chrome上停止工作。

在此先感谢

编辑我也有更多的HTML锚内，我不希望这样的旋转，以便增加“转子”类锚也不会做

编辑这是实际的HTML（上面的例子中被简化）：

<a href="#" class="dropdown-toggle" data-toggle="dropdown"> 
    <i class="icon-bell-alt icon-animated-bell icon-only"></i> 
    <span class="badge badge-success">5</span> 
</a>

来源

2013-06-20 Orlando William

添加转子类代替锚。它会在页面加载时开始旋转，假设这是你想要的？

http://jsfiddle.net/7kANu/4/

<a class="rotator"> 
    <i class="icon-wrench"></i> 
</a>

编辑：你是不是能包住的图标，一个div并分配旋转类，作为一个解决方法吗？

来源

2013-06-20 23:42:28 K20GH

问题是我内部有更多的html锚，我不希望它旋转，我会编辑我的问题，谢谢 –

您可以发布一个示例与额外的HTML？ – K20GH

还增加了另一个建议作为解决方法 – K20GH

FontAwesome图标里面的锚不在铬上动画

回答

相关问题