特效介绍
基于jquery的jquery-rebox全屏相册插件,支持上一张下一张的轮播,以及图片加载动画,兼容浏览器:IE6+、360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗。自适应浏览器,调用方便,易于扩展。
使用方法
1、在head引入相关的css和js:
<link rel="stylesheet" href="css/jquery-rebox.css"> <script src="http://www.5imoban.net/download/jquery/jquery-1.8.3.min.js"></script> <script src="js/jquery-rebox.js"></script> <style> .gallery { width:640px; margin:0 auto; } </style>2、将需要使用本相册插件的图片依次用a链接扩起来,a链接的href属性的地址即是图片大图地址,而a链接的title属性即是相册对应的图片名称。再用div将所有的内容扩起来,然后用它来调用插件,示例如下:
<div id="gallery2" class="gallery"> <a href="images/sample_a.jpg" title="网页模板"><img src="images/sample_a_thumb.jpg"></a> <a href="images/sample_b.jpg" title="免费的html模板下载"><img src="images/sample_b_thumb.jpg"></a> <a href="images/sample_c.jpg" title="夕阳无限好,只是近黄昏"><img src="images/sample_c_thumb.jpg"></a> <a href="images/sample_d.jpg" title="jquery相册插件下载"><img src="images/sample_d_thumb.jpg"></a> </div> <script> $('#gallery2').rebox({ selector: 'a' }); </script>