Jquery：动画ScrollLeft一定量答案

【问题标题】：Jquery: Animate ScrollLeft by a certain amountJquery：动画ScrollLeft一定量
【发布时间】：2014-05-26 11:39:04
【问题描述】：

var xxx= 100px;

$(".scrollbutton").click(function () { 
    $('.selector').animate({scrollLeft:xxx)}, 500);
});

现在它会滚动到距离开始 100 像素的特定位置。如何表达这样的意思，每次单击滚动按钮时，它都会向左滚动 100 像素？

提前致谢。

【问题讨论】：

标签： jquery scroll jquery-animate

【解决方案1】：

试试这个：

var xxx= 100;

$(".scrollbutton").click(function () { 
    $('.selector').animate({scrollLeft:"+="+xxx)}, 500);
});

【讨论】：

【解决方案2】：

我建议以下解决方案：

var scrollLeftAmount = 100;
$('.scrollbutton').click(function () { 
    $('.selector').animate({
        scrollLeft:'+='+scrollLeftAmount
    },500);
});

工作小提琴：http://jsfiddle.net/ZNvLu/2/

基于.animate() 的 jQuery 文档：http://api.jquery.com/animate/#basic-usage

动画属性也可以是relative。如果一个值带有前导 += 或 -= 字符序列，则目标值通过添加或 计算从属性的当前值中减去给定的数字。

例子：

[...] 左：“+=50”，[...]

【讨论】：