javascript - 简单的jQuery图片库

我有一个简单的jquery图片库。当用户单击拇指时，它将在主Image的src属性中将“ thumb”替换为“ large”，我使用jQuery的委托方法来动态加载拇指，并使用它们而无需为新的拇指绑定事件监听器。 jsfiddle

现在，我需要能够链接到图库中的特定图像，例如example.com/gallery.php#3rdimage，以便用户立即看到图库中的第三个图像，类似于engadget使用http://www.engadget.com/photos/samsung-series-5-chrome-os-laptop-vs-11-inch-macbook-air-fight/#4128000的方法

最佳答案

只需获取页面的哈希值，并将其用作针对一组拇指的索引：

wlh = window.location.hash[1];
if (!isNaN(wlh)) {
    $('#largeImage').attr('src', $('#thumbs img').eq(wlh-1).attr('src').replace('thumb', 'large'));
}

演示：jsfiddle.net/EbCKN/show/#3（最初将显示第三个图像）

要在浏览图像时在URL上添加哈希值，以便URL可以用于共享特定图像，请在更改#largeImage之后添加一行：

window.location.hash = $('#thumbs img').index(this)+1;

演示：jsfiddle.net/EbCKN/1/show/（edit）