CSS动画可在Chrome中使用,但不能在FireFox中使用

费尔南多·小

我在http://jsfiddle.net/4LPSD/中有以下代码

它可以在Chrome(版本35.0.1916.153)中使用,但不能在Firefox(版本30.0)中使用。

/******** HTM **********************/
<div class="container">
     <h3>Animated button</h3>
     <button class="btn btn-lg btn-warning"><span class="glyphicon glyphicon-refresh     glyphicon-refresh-animate"></span> Loading...</button>
</div>


/******* CSS **********************/
/* Latest compiled and minified CSS included as External Resource*/

/* Optional theme */
@import url('http://getbootstrap.com/dist/css/bootstrap.css');

.glyphicon-refresh-animate {
    -animation: spin .7s infinite linear;
    -webkit-animation: spin2 .7s infinite linear;
}

@-webkit-keyframes spin2 {
    from { -webkit-transform: rotate(0deg);}
    to { -webkit-transform: rotate(360deg);}
}

@keyframes spin {
    from { transform: scale(1) rotate(0deg);}
    to { transform: scale(1) rotate(360deg);}
}

有人知道怎么了吗?

我正在尝试旋转图片图标。

罗伯特·梅塞尔(Robert Messerle)

您需要包括Mozilla前缀,并在前面删除连字符animation

.glyphicon-refresh-animate {
  animation: spin .7s infinite linear;
  -webkit-animation: spin2 .7s infinite linear;
  -moz-animation: spin2 .7s infinite linear;
}

@-moz-keyframes spin2 {
  from { -moz-transform: rotate(0deg);}
  to { -moz-transform: rotate(360deg);}
}

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

Javascript代码可在JSFiddle中使用,但不能在浏览器中使用

按键只能在Chrome中使用,但不能在Firefox中使用

WebRTC可在Chrome中使用,但不能在Firefox中使用

简单的AddListener,可在代码笔中使用,但不能在Chrome浏览器中使用

parseFloat可在Chrome中使用,但不能在IE或Firefox中使用

粘性页脚模式可在Chrome中使用,但不能在Firefox中使用

我的代码可在Firefox控制台中使用,但不能在Tampermonkey中使用?(不是时间问题)

Python Match Regex可在测试器中使用,但不能在consol中使用

Javascript代码可在Chrome中使用,但不能在其他浏览器中使用

工具提示可在Firefox中使用,但不能在Chrome中使用

JavaScript代码可在Firefox中使用,但不能在Chrome或Edge中使用

正则表达式可在Chrome上使用,但不能在Safari中使用

下载Excel可在Postman中使用,但不能在Javascript中使用

javascript setInterval()可在Dreamweaver中使用,但不能在Chrome中使用

Facebook登录可以在Chrome中使用,但不能在Firefox中使用

CSS动画可以在Chrome和Safari中使用,但不能在Firefox和Internet Explorer中使用

通过关键帧对多个背景图像位置进行动画处理可在Chrome和Safari中使用,但不能在Firefox中使用

jwplayer getDuration可在chrome控制台中使用,但不能在具有IJavaScriptExecutor的C#中使用

jQuery ajax可在Chrome和Safari中使用,但不能在IE8和Firefox中使用

javascript代码可在jsfiddle中使用,但不能在浏览器中使用

jQuery / Javascript函数可在Chrome中使用,但不能在IE11中使用

Flexbox可在Internet Explorer中使用,但不能在Chrome中使用

字体可以在IE中使用,但不能在Firefox或Chrome中使用

jQuery可在Chrome控制台中使用,但不能在Chrome屏幕中使用

jQuery代码可在chrome和IE中使用,但不能在Firefox中使用

xpath可在chrome控制台中使用,但不能在量角器脚本中使用

JavaScript登录按钮可在IE中使用,但不能在Chrome或Firefox中使用

排序/排序文本和数字可在Firefox和Chrome中使用,但不能在Safari中使用

Hover.css库动画不能在Firefox或Edge中使用,但可以在chrome中使用?