Jquery 使缩略图与图像库中的主图像匹配

我正在制作一个图库，为了让用户浏览，我希望他能够同时使用缩略图和下一个/上一个按钮。 他们都在工作，但不是一起工作

当我打开图库时，它会显示图像1。但是，如果我使用缩略图选择图像编号4，然后按“下一步”，它会显示图像编号2。因为“上一个/下一个”按钮正在考虑来自主图库的图像，这是我的宝丽来div

这是小提琴：

下面是我怀疑问题可能出在的js：

$("#thumbnails li img").click(function() {

    var thumbnail_caption = $(this).attr('alt');
    var thumbnail_src = $(this).attr('src');

    $("#polaroid img:visible").fadeOut(function() {
        $(this).attr('src', thumbnail_src).fadeIn();
        $("p.caption").text(thumbnail_caption);
    });
});​

我将src从宝丽来img：可见，但不知何故，它不会永久

---

有人能帮我吗？

如果我是你，我会使用flexslider，所有的工作都是为你完成的，它有很多选项可供选择：

---

您需要存储当前位置，以便增加/减少该位置，然后计算出它与哪个图像相关。谢谢Simon！这是一个很好的建议，我一定会查一查，但目前我真的很想知道我哪里出了问题。。特别是现在，我离写我自己的画廊已经很近了。就像伊恩说的，记住你的位置。所以设置一个变量say var pos，然后当你点击一个缩略图时，将var更改为正确的位置，当你点击forward或next时也是如此。我理解你所说的逻辑，但我真的不知道怎么做。你能给我举个小例子吗？我会一起做个js小提琴谢谢，真的很感激