Javascript jQuery animate（）步骤：现在跨浏览器参数

免责声明：我对jQuery动画非常陌生，这个问题听起来很愚蠢，必须有一个简单的解决方案，但我在网上搜索时甚至找不到它的参考

免责声明2：您将看到的代码没有经过优化，现在我只需要它工作

所以我有这个svg，我必须为它的一些组件制作动画，这没有问题

我写了这段代码，它甚至可以跨浏览器工作，但它不能，我知道为什么，但我不知道如何修复它

$('#button_next').bind('click', function(){
    if(!(parseFloat($('#last_rectangle').attr('x')) <= 308.1)){
        $('.activeScroll').each(function(){
            var xValue = parseFloat($(this).attr('x'));
            // $(this).attr('x', (xValue - 45 - 85.5));
            $(this).animate(
            {
                x: "-=130.5"
            }, {
                duration: 1000, step: function(now) { $(this).attr('x', now); }
            });
        });
    }
});

与

我在记录

now

值时得到了原因。在FF中，它从0到-130.5，这不是我在第一种情况下想要的，在Chrome中，相同的精确代码输出我需要的相对数字，因此它像一个符咒一样工作

为完整起见，这是我的HTML元素的外观：

<rect x="177.6" y="12.9" class="activeScroll" width="85.5" height="2"/>

我有多个

元素

FF似乎无法处理相对值，尽管

xValue

被正确检测到，因此它可以读取（和写入，正如您在注释行中看到的，该行可以跨浏览器工作，但未设置动画）属性

x

文档中没有提到现在的

中有这样的差异，所以我一直在解决这个问题

我使用的是jQuery 2.1.4，如果您认为问题出在版本上，那么更新到3.2.1会给我一个错误，即我正在设置一个只有getter的属性，但是它在jQuery 2.1.4中设置了自己，所以我真的不明白问题出在哪里

有人有线索吗

$(this).attr('x', now);

<rect x="177.6" y="12.9" class="activeScroll" width="85.5" height="2"/>