Question

身体有一个背景（svg），我想在每次点击背景时将它滑到左侧。

在点击处理程序中，我正在使用

$('body').animate({'backgroundPositionX': nex+"em"},1500);

其中nex每次增加600。和chrome和ff更新background-position-x就好了。但就是说，它以一种非常奇怪的方式运作。或者说不是以一种非常奇怪的方式工作。

当我点击f12时，在ie10中，背景位置x始终在样式选项卡上保持不变，但在“计算”选项卡上更改。但即使你可以看到计算值的变化，当你读到background-position-x时你也没有得到任何东西，所以jquery从ZERO动画到新的位置，而不是从当前位置。

我正在努力寻找解决方法。

Answer 1

好的人，background-position-x在IE中不受支持，这真的是一个无赖，因为jquery的动画只适用于单个属性，而不是像background-position: 5em 10em这样的属性。

解决方法是创建一个虚拟var（此处为x）并为其设置动画，并每次构建字符串，如下所示：

backposx=0;
function next_click() 
{
    $({x: 0}).animate({x: 600}, {
        duration: 1500,
        step: function(){
            $("#background").css("background-position",(backposx-~~this.x) + "em 0%");},
        complete:function(){backposx-=600;}
    });
}

ie10 background-position-x的解决方法

1 个答案: