如何制作3x3 img网格并选择一个大的下一个/上一个按钮

Question

我确信之前已经问过这个问题并且我已经看过并试过了它们但是它们似乎都没有正常工作。

我正在为客户创建一个网站，他们想要一个页面，其中包含3个3x3网格格式的图像。然而，我坚持的一点是，如果用户点击它并且底部有下一个/前一个按钮，而背景仍有3x3网格但是黑暗以显示该图像，则他们想要放大图像他们选择了一张图片。

目前我所拥有的是：

<div class="col-xs-12">
    <img src="image1.png">
    <img src="image2.png">
    <img src="image3.png">
    <img src="image4.png">
    <img src="image5.png">
    <img src="image6.png">
    <img src="image7.png">
    <img src="image8.png">
    <img src="image9.png">
</div>

我还没有得到任何与CSS或JavaScript相关的内容，因为我尝试了多种与此相关的不同内容，但它们似乎都没有效果。有人可以帮忙吗？