罕见的IE10错误:背景位置的CSS动画因多个背景和百分比而失败 [英] Rare IE10 bug: CSS animation of background-position fails with multiple backgrounds and percentage

问题描述

这是一个非常具体的错误-但是，我希望有人向我展示解决方法！该错误主要是由于同时满足以下两个条件 的情况下，IE10无法执行background-position的CSS动画:

This is a very specific bug - however, I would love for someone to show me a workaround! The bug basically consists in IE10 failing to do CSS animation of background-position when these two conditions are met at the same time:

• 具有多个背景
• 以百分比设置background-position

这是一个演示，将Chrome与IE10进行比较:

Here's a demo, compare Chrome with IE10:

http://codepen.io/dalgard/pen/LiyIK

推荐答案

您需要在零后面加上一个百分号. 一定是这样:

You need to put a percentage sign after the zeros. It must be so:

@keyframes move {
  0% { background-position: 0%, 0%; }
  100% { background-position: 0%, 100%; }
}

这篇关于罕见的IE10错误:背景位置的CSS动画因多个背景和百分比而失败的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！