使用缩略图更改Nivo幻灯片

时间:2013-04-15 14:42:06

标签: slider gallery thumbnails nivo-slider

我正在尝试使用Nivo Slider和缩略图做一些不同的事情。我想使用缩略图完全更改幻灯片中的所有图像,而不是使用缩略图跳转到特定幻灯片。让我试着解释一下。在页面顶部,我有Nivo滑块。下面是3个缩略图,我们称之为“thumb1.jpg”,“thumb2.jpg”和“thumb3.jpg”。

当我点击thumb1.jpg时,幻灯片应循环播放图像1a.jpg,1b.jpg,1c.jpg等。当我点击thumb2.jpg时,幻灯片应循环播放图像2a.jpg,2b .jpg,2c.jpg等。当我点击thumb3.jpg时,幻灯片应该循环显示图像3a.jpg,3b.jpg,3c.jpg等。

所有这一切都需要在一个页面上进行一次幻灯片放映,而不是包含3个单独的页面和3个单独的幻灯片。该解决方案可以使用jQuery,PHP或其他任何工作。有没有办法实现这个目标?

如果以前曾经问过这个问题,我很抱歉,但我的所有搜索都是用缩略图跳转到特定的幻灯片。任何帮助将不胜感激!

2 个答案:

答案 0 :(得分:0)

你可以把它们放在那些小滑动指示器的css中我认为,虽然我不是很熟悉它,但是你可以尝试一下。

所以更换图像的球并编辑它的CSS

答案 1 :(得分:0)

啊......我用一些非常简单的PHP来解决它。缩略图是带有查询字符串的链接,用于指示图片被拉出的目录。例如red / pic1.jpg,red / pic2.jpg或green / pic1.jpg,green / pic2.jpg,或blue / pic1.jpg,blue / pic2.jpg。