如何使用 jquery animate 滚动

Question

我正在尝试让一些按钮在这里工作。 http://www.sepulturaimpex.ro/portofoliu 是网站。

当我点击左/右按钮时，我想准确地从一个项目移动到另一个项目

图片的宽度是随机的。

我怎样才能做到这一点？

这是我正在使用的脚本。

$(document).ready(function () {
    $(".prev").click(function () {
        $(".p_horizontal_wrap").animate({
            scrollLeft: "-=700"
        })
    }), $(".next").click(function () {
        $(".p_horizontal_wrap").animate({
            scrollLeft: "+=700"
        })
    })
}),

Answer 1

答案就在你的问题中；如果图像的宽度是随机的，那么您不能滚动 w/ 固定宽度

我认为最好的办法是向前看并找到下一个对象的 x 位置，然后滚动到该位置。根据您的标记，您可能需要跟踪滚动到视图中的对象索引。

您的下一个按钮（和您的下一个/上一个可能相同）如下所示：

$(".next").click(function() {
    var targ = /** find out the next item to be shown **/
    var left = $(targ).position().left;
    $(".p_horizontal_wrap").animate({
        scrollLeft: left
    });
});