jQuery写一个相册，一共有4张图片，有两个按钮，一个上一张一个下一张，点击上一张按钮图片播到第一张时接着最后一张播出，点下一张按钮到第四张时下一张是第一张

要使用jQuery实现一个简单的图片相册轮播功能，你可以按照以下步骤进行：

1. 准备HTML结构，包含图片和控制按钮。
2. 使用CSS设置图片容器的样式，确保图片可以在这个容器中正确地显示和轮播。
3. 使用jQuery编写JavaScript代码，实现点击按钮切换图片的功能，并且处理边界情况（即到达第一张图片时跳转到最后一张，以及到达最后一张时跳转到第一张）。

以下是一个简单的实现示例：

HTML代码：

<div id="gallery">
    <img src="image1.jpg" alt="图片1">
    <img src="image2.jpg" alt="图片2">
    <img src="image3.jpg" alt="图片3">
    <img src="image4.jpg" alt="图片4">
</div>
<button id="prev">上一张</button>
<button id="next">下一张</button>

CSS代码：

#gallery {
    position: relative;
    width: 600px; /* 设置相册宽度 */
    height: 400px; /* 设置相册高度 */
    overflow: hidden;
}

#gallery img {
    width: 100%;
    height: auto;
    display: none; /* 初始隐藏所有图片 */
    position: absolute;
}

#gallery img:first-child {
    display: block; /* 只显示第一张图片 */
}

JavaScript代码：

$(document).ready(function() {
    var currentIndex = 0;
    var galleryImages = $('#gallery img');
    var totalImages = galleryImages.length;

    $('#next').click(function() {
        currentIndex = (currentIndex + 1) % totalImages;
        galleryImages.hide().eq(currentIndex).show();
    });

    $('#prev').click(function() {
        currentIndex = (currentIndex - 1 + totalImages) % totalImages;
        galleryImages.hide().eq(currentIndex).show();
    });
});

在这个实现中，每次点击按钮时，`currentIndex`变量会增加或减少，并且通过取模操作确保它总是在有效范围内（0到图片总数减1）。图片会根据当前索引显示或隐藏。