javascript - 在新选项卡中打开缩略图

Question

我是新人，我的大脑正在燃烧

我的问题是访问我有一个网站柠檬x.biz。

正如你所见，我在那里制作了 4 个框架，展示 zara Hermes 和 puma 的小鞋。

当用户点击显示 zara puma 和 Hermes 鞋的文件夹 images/zara/thumbnals/1.png 中的小缩略图时，会打开一个新窗口选项卡，其中显示缩略图的较大版本使用 html javascript 或 jquery 在 div 中 images/zara/1.png 图像。

Answer 1

将图像包裹在 anchor 标记中，并使用指向图像较大版本的 href 和 target="_blank"。

编辑:按照您更新的说明。

不要直接链接到图像，而是链接到 next.html#name_of_image.jpg。然后，当加载 next.html 时，执行 javascript 以使用适当的图像填充目标 div。

例如:

<!--Include a placeholder image in your HTML in the target div...-->
<div id="target_div">
    <img id="target_img" style="display: none;" src=""/>
</div>

<!--...And populate it on page load with Javascript.-->
<script type="text/javascript">
    window.onload = function() 
    {
        if (location.hash) //Only do this if there's an actual hash value.
        {
            var imgPath = 'path/to/images/directory/'; //Build the path to the images directory.
            var imgName = location.hash.substring(1); //Get the name of the image from the hash and remove the #.
            document.getElementById('target_img').src = imgPath+imgName; //Update the src of the placeholder image with the path and name of the real one.
            document.getElementById('target_img').style.display = 'inline'; //Now that it has a valid source, reveal it to the viewer.
        }
    }
</script>