Javascript jQuery.css（）中的增量百分比变化

以下代码起作用：

  $('.container').css({
    'left': '-100%' 
  });

此代码不会：

  $('.container').css({
    'left': '-=100%' 
  });

它改为像素。我尝试将

%

作为字符串添加到末尾，但仍然不起作用。我不知道如何让它在递增/递减时保持百分比

有可能吗？

您可以使用

animate（）

函数增加百分比

$('#yourId').animate({
            left: previousLeftValue+IncrementValue //Assuming that previous left value is stored somewhere
        }, 300 );

它在这里工作。。 请看这个

$(document).ready(function(){
 $("button").click(function(){
  $("div").animate({left:'-=10%'}, 5000, 'linear');
 });
});

---

我建议你使用以下方法

Jquery

var x = $('#element');
x.css('left', (parseFloat(x.css('left')) + 10) + '%');

CSS

#element{
  left : 5%;
  position : relative; //Its important
}

---

这是我的建议。希望这有帮助。

使用CSS，这是不可能的。使用普通的javascript，你必须计算vaues，然后在css属性中分配它。Animate确实有效，但我希望使用css转换，因为它们更平滑，如果我不能计算出来，我会接受这个答案，并找到一个jquery插件或其他东西。当css转换应用于元素时，它的行为会很奇怪，第一张幻灯片不错，但之后它会飞到第四张幻灯片。虽然移除了css转换，但效果很好。哦。。你是用css转换实现的吗？？如果是的话？你能给我看看结果吗？我可能已经想出了解决办法。如果我使用velocity.js，我会获得比animate更好的性能，以及我在过渡中使用的相同贝塞尔松弛：）排序，改为velocity而不是animate。谢谢！：）