这两天在网上看了那个图片效果,觉得挺帅的,就照着做了,有很多图片的插件,我选择的是这个: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中,不然好像没效果,我今天试的
分享到:
相关推荐
jquery-lightbox-0.5
jquery-lightbox-0.5 仿腾讯空间相册 ;点击缩略图时,弹出层显示原始图片!效果挺不错!
<link rel="stylesheet" href="jquery.lightbox-0.5.css"> 载入 JavaScript 文件 <script src="jquery.js"></script> <script src="jquery.lightbox-0.5.js"></script> DOM 结构 <div id="element_id"> 文字说明...
jquery-lightboxjquery-lightboxjquery-lightboxjquery-lightboxjquery-lightboxjquery-lightbox
此版本为jquery.lightbox-0.5修正版,解决图片源文件太大,占满屏幕问题。 使用方法,参数定义与原版相同
jquery.lightbox.js遮罩层图片幻灯片自适应图片 jquery.lightbox.js遮罩层图片幻灯片自适应图片 jquery.lightbox.js遮罩层图片幻灯片自适应图片 jquery.lightbox.js遮罩层图片幻灯片自适应图片
sexy-lightbox-2.3_jQuery sexy-lightbox-2.3_jQuery sexy-lightbox-2.3_jQuery
本插件是借用强大的图片浏览插件Lightbox 而扩展而来的,主要用途是用于展示图片。
ekko-lightbox.js是一款基于Bootstrap3的jQuery lightBox图片画廊插件。该lightBox插件基于Bootstrap的模态窗口插件来制作,可以显示图片,HTML内容,视频等,也可以远程加载内容。
图片展示效果-jquery Lightbox 图片展示效果-jquery Lightbox
前端项目-nivo-lightbox,一个简单、灵活、响应迅速、支持视网膜的jquery lightbox插件
内容索引:脚本资源,jQuery,lightbox,jQuery插件,无刷新放大 jQuery Lightbox 图片显示效果修饰插件,可以帮你完成让网页上的图片无刷新放大,自动检测图片大小从而变换图片外框的大小,放大图片时候背景是灰色的,...
jquery仿Lightbox的插件jQuery UI.ariaLightbox点击图片放大显示插件下载.rar
jquery实现LightBox图片点击放大效果的图片盒子插件.rar
采用Jquery实现的lightbox完整实例
slick-lightbox.js是一款基于slick.js和jquery的响应式弹出层lightbox插件。该jquery lightbox插件支持图片懒加载,支持键盘交互,支持HTML5 History API等。功能非常强大。
前端项目-ekko-lightbox,A lightbox gallery plugin for Bootstrap 3 based on the modal plugin
前端项目-slick-lightbox,一个光盒包装为肯的惊人的光滑旋转木马。
Lightbox相册插件jquery-rebox,实用简单,支持响应式设计。
jquery仿LightBox图片盒子单击逐渐放大的图片展示的插件下载.rar