轮播包装时如何计算缩略图的索引但索引继续增加？

Question

我认为这更像是一个数学问题......

我正在使用名为jcarousel的旧版JavaScript转轮库。它需要一个图像列表并将其转换为旋转木马/幻灯片。它支持包装功能，当您点击最后一个图像时，它会环绕到幻灯片的开头。我使用回调函数接收旋转木马中所有图像列表中显示的图像的当前索引。但是，当你到达旋转木马的末尾并重新开始时，索引不会重置到开头，它会继续增加。

这是一个例子......让我说我的旋转木马里有5张图片。索引从1开始（不是0）。当轮播到达image5时，显示的下一个图像是image1，但索引是6.同样，向另一个方向，索引递减。

-1. image4
0. image5
1. image1
2. image2
3. image3
4. image4
5. image5
6. image1
7. image2

如何计算索引以使其保持在缩略图索引的范围内？例如：

• 当index == -1 //索引应该是4，因为它显示的是image4
• 当index == 1 //索引可以是1时，那很好。我可以轻松地将1减去基于0的索引
• 当index == 6 //索引应为1，因为它显示的是image1

Answer 1

使用模数函数。假设numImg包含图像总数，您可以通过计算获得正确的数字

 (index + numImg) % numImg

将numImg添加到索引可确保处理-1，模数（％）numImg计算除法的余数，因此结果介于0和numImg之间。