Jquery/javascript显示下一幅图像，隐藏上一幅图像

我在一个页面上有这个html，我想在单击图像链接时隐藏第一个图像并显示下一个图像，例如“下一个”或“上一个”

这是html：

<tbody>
    <tr>
        <td valign="middle">
            <input type="image" style="border-width:0px;" src="previous.gif" id="previous">
        </td>
        <td></td>
        <td align="center">
            <img src="image1.jpg" class="image_in_collection">
            <img src="image2.jpg" class="image_in_collection">
        </td>
        <td></td>
        <td valign="middle">
            <input type="image" style="border-width:0px;" src="next.gif" id="next">
        </td>
    </tr>
</tbody>

jshiddle here:

您可以将next（）选择器与is（“：visible”）选择器一起使用来实现这一点。

---

这可能最好通过jQuery插件来实现，因为我假设您正在制作某种图像库。看看jQuery循环。它可以制作按钮，并为您提供良好的过渡。也很容易使用，而且高度可定制。我会想一些简单的JS可以做到这一点，如果我遗漏了什么，这是我的尝试。