jquery - 如何使用按钮（图像）对水平 Div 滚动进行检查？

Question

我有三个 div

1. 上一个按钮（图像）
2. 容器（内容）
3. 下一个按钮（图片）

如果我点击previous或next图像它滚动正常。如果我单击next按钮滚动在最后一个元素处停止，但同样不适用于上一个按钮。意味着如果我单击上一个按钮，滚动应该在第一个元素处停止，但它会继续。

问题链接[小提琴]：

Answer 1

为了使滚动在第一个元素处停止，您应该将其设置marginLeft为0而不是100px在 left.click 上，这会导致左侧的间隙。

但是，这种方法对于创建逐个滑动滚动条并不理想，我猜当前的实现只是使用户能够滚动到第一个或最后一个元素。它应该在每次上一个/下一次单击时滚动等于每张幻灯片宽度的量，直到到达第一个或最后一个元素。

Answer 2

$(document).ready( function() {
    $("#left").click( function() {
        var pos = $("#content").css('marginLeft','0px');
        $("#content").scrollLeft(pos);
    });
    $("#right").click( function() {
        var pos = $("#content").css('marginLeft', '-164px');
        $("#content").scrollLeft(pos);
    });
});

在左键单击时将 Marginleft 更改为 0，在右键单击时更改为 -164px