简介

jquery.slider.js是一款JQuery图片轮播插件，可以有暂停等多种功能的图片轮播，也有多种渐变效果，非常漂亮！

参数说明：

width      : 900,   宽度（必用）
height     : 325,   高度（必用）
transition : 'bar'  渐变类型:有'fade'渐隐渐变,'square'正方形块渐变，'bar'从右向左切换渐变，'squareRandom'正方形块随机渐变,'explode'正方形块爆炸渐变 'fountain'向上喷水渐变, 'rain'下雨渐变,'random'随机效果（常用） 
navigation: true,   是否显示左右切换的导航（常用） 
selector: true,     是否显示右下角的方块按钮（常用） 
control: true,      是否显示中间的暂停按钮（常用） 
timer:true,    是否显示时间的进度条（常用） 
pauseOnClick: true, 表面意思是是否单击暂停，但是好像没有效果 
pauseOnHover: true, 鼠标移到图片上是否暂停
loop: true,         是否循环
slideshow: true,    图片是否切换
delay: 4500,        延迟时间，4500毫秒表示4.5秒，因为1秒等于1000毫秒
duration: 400,      表面意思是持续时间，但是好像也没有效果
bars: 9,            这个表示transition的过渡效果'bars'的数量，9表示有9个方块，1表示就有1个
columns: 7,         表面意思是7列，但是好像也没有什么效果
rows: 3,            看不出什么效果
speed: 80,          一张幻灯切换到另一张幻灯时的速度
padding: 8,         看不出效果
easing: "easeOutCubic",    擦除效果，这个需要另一款插件的结合
transition: 'random',  过渡效果
onComplete: function() {},  完成时运行函数
onSlideshowEnd: function() {}   幻灯片结束之运行函数，这个和上一个区别在于时间的判断

（下载的附件中带有DEMO）

使用

1.  引入 jquery.js 和 jquery.slider.js 文件

2.  HTML

<div>
<div> <img src="images/slide_1.jpg" alt=""> </div>
<div> <img src="images/slide_2.jpg" alt=""> </div>
<div> <img src="images/slide_3.jpg" alt=""> </div>
</div>

3.  调用

<script type="text/javascript">
jQuery(document).ready(function($) {
$(".slider").slideshow({
width      : 900,
height     : 325,
transition: 'random'
});
});
</script>

相关链接

在线演示地址：https://www.jq22.com/yanshi11469