如何为幻灯片中的图像制作 link？

Question

对于我的投资组合网站，我在我的工作页面上制作了一个带有 cycle2 轮播和一些大图像的幻灯片。

所有的图片也显示在主页上，真的很小。

我想让主页上的小图片与幻灯片中的大图片一样 link。

我试图为幻灯片中的所有图像提供与 link 不同的 ID。但是 link 总是转到幻灯片的第一张图片，而不是带有 id 的图片。任何人都可以给我一些建议吗？

谢谢，诺亚

Answer 1

您需要使用 cycle2 api 在用户单击 link 时将幻灯片转换为适当的幻灯片。这是 api 文档中的相关片段：

// goto 3rd slide
$('.cycle-slideshow').cycle('goto', 2);

您只需使用相关幻灯片的索引号即可。您可以运行此代码，然后让 link 指向幻灯片的锚点。

有关 api 的其余文档可在此处找到：http://jquery.malsup.com/cycle2/api/

更新

$(document).ready( function() {
    var field = 'slide';
    var url = window.location.href;
    var slideNumber = url.indexOf('?slide');
    if ( slideNumber === -1 ) {
        slideNumber = url.indexOf('&slide');
    }
    if ( slideNumber >= 0 ) {
        $('.cycle-slideshow').cycle('goto', url[slideNumber + 1]);
    }
});

如何为幻灯片中的图像制作 link？

How do I make a link to an image in a slideshow?

javascript

cycle2