jquery - 为什么scrollLeft函数只在第一次点击时起作用？

Question

我希望 scrollLeft 函数在每次单击前进按钮时滚动一个 div

代码:

 $("#nextbutton").click(
  function()
  {
   $("#thumbholder").scrollLeft(300);
 });

Thumbholder 保存图像及其 overflow:hidden，我想通过向左滚动来显示隐藏的项目。

#thumbholder 
{
height:30%;
width:90%;
overflow: hidden;
white-space:nowrap;
margin:2% auto; 
}

谁能告诉我如何在每次点击“#nextbutton”时重复scrollLeft函数，而不仅仅是第一次点击它时？

Answer 1

问题是 scrollLeft 采用绝对滚动条位置，而不是相对位置。

参见the docs for scrollLeft .

尝试使用 .scrollLeft() 获取现有位置，从中减去 300，然后使用您已经使用的 .scrollButton(value) 函数将其应用回来使用:

http://jsfiddle.net/RjWKp/

$("#leftButton").click(
    function() {
        var thumbHolder = $("#thumbholder");
        thumbHolder.scrollLeft(thumbHolder.scrollLeft() - 300);
    }
);