您可以通过单击单个图像使用 prettyPhoto 打开图像库吗？答案

【问题标题】：Can you open a gallery of images using prettyPhoto by clicking on a single image?您可以通过单击单个图像使用 prettyPhoto 打开图像库吗？
【发布时间】：2015-01-06 17:27:09
【问题描述】：

单击单个图像后，我正在尝试使用 prettyPhoto 打开图像库。

在他们的演示页面上，我可以看到如何通过一堆图片来实现这一点：

<a href="images/fullscreen/1.jpg" rel="prettyPhoto[pp_gal]" title="You can add caption to pictures."><img src="images/thumbnails/t_1.jpg" width="60" height="60" alt="Red round shape" /></a>
<a href="images/fullscreen/2.jpg" rel="prettyPhoto[pp_gal]"><img src="images/thumbnails/t_2.jpg" width="60" height="60" alt="Nice building" /></a>
<a href="images/fullscreen/3.jpg" rel="prettyPhoto[pp_gal]"><img src="images/thumbnails/t_3.jpg" width="60" height="60" alt="Fire!" /></a>
<a href="images/fullscreen/4.jpg" rel="prettyPhoto[pp_gal]"><img src="images/thumbnails/t_4.jpg" width="60" height="60" alt="Rock climbing" /></a>
<a href="images/fullscreen/5.jpg" rel="prettyPhoto[pp_gal]"><img src="images/thumbnails/t_5.jpg" width="60" height="60" alt="Fly kite, fly!" /></a>

不过，我确实需要将其设为相册样式，这意味着一旦您单击一个图像，其他图像就会显示在 prettyPhoto 弹出窗口中。

【问题讨论】：

没有答案？这很难..!!
你可以查看我的答案

标签： jquery image-gallery prettyphoto

【解决方案1】：

是的！我认为这不是一个正确的方法，但这会有所帮助。将专辑封面以外的其他图片放在另一个 div 中，并使其不显示 css。

<a href="images/fullscreen/1.jpg" rel="prettyPhoto[pp_gal]" title="You can add caption to pictures."><img src="images/thumbnails/t_1.jpg" width="60" height="60" alt="Red round shape" /></a>
<div style="display:none;">
<a href="images/fullscreen/2.jpg" rel="prettyPhoto[pp_gal]"><img src="images/thumbnails/t_2.jpg" width="60" height="60" alt="Nice building" /></a>
<a href="images/fullscreen/3.jpg" rel="prettyPhoto[pp_gal]"><img src="images/thumbnails/t_3.jpg" width="60" height="60" alt="Fire!" /></a>
<a href="images/fullscreen/4.jpg" rel="prettyPhoto[pp_gal]"><img src="images/thumbnails/t_4.jpg" width="60" height="60" alt="Rock climbing" /></a>
<a href="images/fullscreen/5.jpg" rel="prettyPhoto[pp_gal]"><img src="images/thumbnails/t_5.jpg" width="60" height="60" alt="Fly kite, fly!" /></a>
</div>

【讨论】：

所有图片都加载到页面不是个好主意，页面会变慢

【解决方案2】：

我这样做是为了解决我网站上的这个问题

<a href="Images/1.jpg" rel="prettyPhoto[pp_gal]">
    <img src="Images/2.jpg" />
</a>

而对于另一个图像，只需编写一个标签并将 Rel 设置为像这样对 Rel 进行分组

<a href="Images/3.jpg" rel="prettyPhoto[pp_gal]"></a>
<a href="Images/4.jpg" rel="prettyPhoto[pp_gal]"></a> 
<a href="Images/5.jpg" rel="prettyPhoto[pp_gal]"></a>

【讨论】：