Question

我正在尝试创建一个页面，其中包含一组缩略图，其中包含通过cms加载的图像。这些缩略图有一个可点击的事件，一旦点击将会打开一个页面，其中包含该滑块的所有图像，并加载到我选择的幻灯片中。

现在我正在玩弄不同的想法，但我想知道将一个外部缩略图页面链接到带有皇家滑块库的模板是多么容易，这样当点击缩略图时它会转到图库中的右图像在那个外部页面上？

我知道有使用带有currSlide等的api。这可以应用于这个想法的相同原理，因此缩略图列表中的每个图像都可以有一个id / number，当点击它时它对应于currSlide在画廊中，并在打开时显示一个？

slider.currSlideId // current slide index
slider.currSlide // current slide object

它是否也会使用api中的这个：

slider.ev.on('rsSlideClick', function() {
    // triggers when user clicks on slide
    // doesn't trigger after click and drag
});

任何想法都会很棒。

谢谢，标记

Answer 1

这应该非常简单。使用RoyalSlider，您可以执行以下操作（用户单击缩略图链接并在幻灯片中转到正确的幻灯片）：

// Get slider instance from royalSlider data
var slider = $(".royalSlider").data('royalSlider');

// Activate the thumbnail links   
$("ul#thumbnails a.fullScreenGallery").click(function(e) {
    e.preventDefault();
    var slideIndex = $("ul#thumbnails a.fullScreenGallery").index(this);
    slider.goTo(slideIndex);
});

如何制作链接到皇家滑块库中图像的缩略图页面

1 个答案: