html - -moz-transform-origin 在 firefox 中不工作

标签 html css

这在 webkit 中有效,但出于某种原因 -moz-transform 在 FF 中不起作用,有什么想法吗?

http://jsfiddle.net/KtCSy/

<img id="heart" width="47" height="42"  src="http://24.media.tumblr.com/d95e8df8385d7c4696d1211e8d8f7e64/tumblr_mm5q9hi3iF1rgpyeqo1_500.png" alt="love">

#heart {
    margin-top: -10px;
    margin-left: 3px;
  -webkit-animation: Pulse 2s ease-out infinite;
  image-rendering: -webkit-optimize-contrast;
}
@-webkit-keyframes Pulse {
  0%   {
    -webkit-transform-origin: 50% 100%;
    -webkit-transform: scale(1);
     -moz-transform-origin: 50% 100%;
     -moz-transform: scale(1);
  }
  50%   {
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(1.5);
     -moz-transform-origin: 50% 50%;
     -moz-transform: scale(1.5);
  }
  100% {
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(1);
     -moz-transform-origin: 50% 50%;
    -moz-transform: scale(1);
  }
}

最佳答案

所有的 -moz- 规则都保存在 -webkit- @ 规则中,因此只有 WebKit 会看到它们(并忽略它们)

关于html - -moz-transform-origin 在 firefox 中不工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16363522/

相关文章:

android - 输入文件接受 ="image/*"捕获 ="camera"禁止在移动设备上浏览

html - 同一页上的两个无序列表,一个内联和一个初始

css - 无法从子目录加载 Font Awesome

html - 如何使用 CSS 使用圆形或圆锥形渐变?

html - 访问状态后按钮的背景颜色问题

javascript - HTML5 历史 API : Refresh and Back issues

javascript - 如何动态重命名每个 jQuery clone div 子元素 id

html - 如果我设置显示 : block or inline to them?,<div> 和 <span> 之间有什么不同

javascript - 将缩略图添加到基本的 jQuery slider

html - 在 2 个固定 div(顶部和底部)之间制作滚动文本内容