Question

我有一个包含图片的页面。每个图像都有与之相关的信息，当点击图像时，我想让它在自己的页面（而不是新的标签或窗口）中打开，并在其周围显示一些相关信息。

有没有办法在不必手动为每张图片制作页面的情况下执行此操作？我正在处理大量图片，因此自动化是关键。

Answer 1

这样的东西？信息可以移动，根据需要设置。

.info{display:none}
img:hover +.info{display:inline;}

<img src="http://lorempixel.com/150/150"width="150" height="150" />
<span class="info">This pic is super</span>
<img src="http://lorempixel.com/150/150"width="150" height="150" />
<span class="info">This pic is super</span>
<img src="http://lorempixel.com/150/150"width="150" height="150" />
<span class="info">This pic is super</span>
<img src="http://lorempixel.com/150/150"width="150" height="150" />
<span class="info">This pic is super</span><img src="http://lorempixel.com/150/150"width="150" height="150" />
<span class="info">This pic is super</span><img src="http://lorempixel.com/150/150"width="150" height="150" />
<span class="info">This pic is super</span><img src="http://lorempixel.com/150/150"width="150" height="150" />
<span class="info">This pic is super</span>*emphasized text*

在自己的页面中打开图像并提供信息

1 个答案: