用jqueyr插件做的一个不图片类子 jquery-lightbox-0.5-优快云博客

本文介绍如何使用jQuery Lightbox插件轻松创建图片画廊。只需将JS及CSS文件引入项目，并按照指定格式组织图片链接即可实现美观的图片展示效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

这两天在网上看了那个图片效果,觉得挺帅的,就照着做了,有很多图片的插件,我选择的是这个:jquery-lightbox-0.5,觉得还挺好的,其实看到例子,你就知道应该会怎么做了,
挺简单的一个,只要把JS所及相关的CSS放到工程下面,就可以了...

核心代码就是这个:

<div id="gallery">
<ul>
<li>
<a href="photos/image1.jpg" title="Utilize a flexibilidade dos seletores da jQuery e crie um grupo de imagens como desejar. $('#gallery').lightBox();">
<img src="photos/thumb_image1.jpg" width="72" height="72" alt="" />
</a>
</li>
<li>
<a href="photos/image2.jpg" title="Utilize a flexibilidade dos seletores da jQuery e crie um grupo de imagens como desejar. $('#gallery a').lightBox();">
<img src="photos/thumb_image2.jpg" width="72" height="72" alt="" />
</a>
</li>
<li>
<a href="photos/image3.jpg" title="Utilize a flexibilidade dos seletores da jQuery e crie um grupo de imagens como desejar. $('#gallery a').lightBox();">
<img src="photos/thumb_image3.jpg" width="72" height="72" alt="" />
</a>
</li>
<li>
<a href="photos/image4.jpg" title="Utilize a flexibilidade dos seletores da jQuery e crie um grupo de imagens como desejar. $('#gallery a').lightBox();">
<img src="photos/thumb_image4.jpg" width="72" height="72" alt="" />
</a>
</li>
<li>
<a href="photos/image5.jpg" title="Utilize a flexibilidade dos seletores da jQuery e crie um grupo de imagens como desejar. $('#gallery a').lightBox();">
<img src="photos/thumb_image5.jpg" width="72" height="72" alt="" />
</a>
</li>
</ul>
</div>

一定要放到UL--LI中,不然好像没效果,我今天试的