jq各种插件层出不穷，当然幻灯片插件也不例外，于是本人也自已写了一款，对于目前所做项目来说，足够用了，slideV1.0插件使用很简单，配置如下：
1、三种按钮类型接口选择（默认类型、数字类型、缩略图类型）
2、三种动画类型接口选择（渐变、上下、左右）
3、二种事件类型选择（点击、鼠标经过）
4、动画速度
5、动画间隔时间
6、是否自动切换
7、是否显示左右按钮
8、当前状态按钮类名可配置
9、左按钮类名可配置
10、右按钮类名可配置
11、是否显示标题
提供多种常用参数：
defaults = {
numType: 0, //是否显示数字0(默认)、1(数字类型)、2(缩略图，注:缩略图是根据大图创建，比例根据自已来定)
animateType: 'left', //动画类型 fade、left、top
eventType: 'mouseover', //事件类型 click、mouseover
speed: 500, //动画切换速度
time: 2000, //动画切换间隔时间
autoPlay: true, //是否自动播放 true为自动播放
btn: true, //是否显示左右按钮
cur:'cur', //按钮当前状态样式
prev: 'prev', //左按钮默认class类名
next: 'next', //右按钮默认class类名
title: true //是否显示标题
};
调用方式：
$(function () {
$('#slide1').slide({
numType: 0,
cur:'active'
});
$('#slide2').slide({
numType: 1,
animateType: 'top',
eventType: 'click',
speed: 500,
time: 2000,
prev: 'left',
next: 'right',
cur: 'active'
});
$('#slide3').slide({
numType: 2,
animateType:'fade',
prev: 'left_btn',
next: 'right_btn',
title:false,
cur: 'active',
btn:false
});
});
css：
*{ margin:; padding:;}
body{ font:14px 'Microsoft YaHei';}
.slide{ width:600px; height:200px; overflow:hidden; margin:20px auto; position:relative;}
.slide ul{ position:absolute; left:; top:;}
.slide ul li{ float:left; width:600px; height:200px;}
.slide ul li img{ max-width:100%;}
.slide ol{ position:absolute; z-index:; right:; bottom:; }
.slide ol li{float:left; list-style:none; background:red; height:20px; text-align:center; line-height:20px; margin:5px; width:20px; cursor:pointer; border-radius:10px;}
.slide ol li.cur{ background:green; color:#fff; text-align:center;}
#slide2 ol li{ background:yellow;}
#slide3 ol li{ width:76px; height:36px; border:2px solid #fff; background:none; border-radius:; overflow:hidden;}
#slide3 ol li img{ width:76px; height:36px;}
/********* 按钮当前状态样式 ********************/
#slide1 ol li.active{background:green; color:#fff;}
#slide2 ol li.active{ background:#fff;}
#slide3 ol li.active{ width:76px; height:36px; border:2px solid blue;}
/********* 左右按钮 *********/
.prev,.next,.left,.right,.left_btn,.right_btn{ width:30px; height:60px; background:red; text-align:center; line-height:60px; color:#fff; font-size:18px; position:absolute; z-index:; top:80px; text-decoration:none;}
.prev,.left,.left_btn{ left:;}
.next,.right,.right_btn{ right:;}
.prev:hover,.next:hover{ background:green;}
.left,.right{ background:yellow; color:#000;}
.left:hover,.right:hover{ background:#fff;}
.left_btn,.right_btn{ background:#fff; color:#000;}
.left_btn:hover,.right_btn:hover{ background:blue;color:#fff;}
/********* 标题 *********/
.slide div{ position:absolute; bottom:; left:; z-index:; width:100%; height:35px; line-height:35px; overflow:hidden;}
.slide div i{ position:absolute; z-index:; left:; top:; background:#000;opacity:0.7;filter:alpha(opacity=70); width:100%; height:100%;}
.slide div h3{ position:absolute; left:; top:; z-index:;width:100%; height:100%; overflow:hidden; color:#fff; text-indent:10px; font-weight:normal;}
html：
<div class="slide" id="slide1">
<ul>
<li><img src="data:images/pic01.jpg" alt="广州车展" /></li>
<li><img src="data:images/pic02.jpg" alt="奔驰" /></li>
<li><img src="data:images/pic03.jpg" alt="宝马" /></li>
<li><img src="data:images/pic04.jpg" alt="上海大众" /></li>
<li><img src="data:images/pic05.jpg" alt="上海丰田" /></li>
</ul>
</div><!--slide end--> <div class="slide" id="slide2">
<ul>
<li><img src="data:images/pic04.jpg" alt="奥迪" /></li>
<li><img src="data:images/pic05.jpg" alt="路虎" /></li>
<li><img src="data:images/pic06.jpg" alt="奔驰" /></li>
<li><img src="data:images/pic07.jpg" alt="上海丰田" /></li>
<li><img src="data:images/pic08.jpg" alt="广州车展" /></li>
</ul>
</div><!--slide end--> <div class="slide" id="slide3">
<ul>
<li><img src="data:images/pic03.jpg" alt="路虎" /></li>
<li><img src="data:images/pic04.jpg" alt="广州车展" /></li>
<li><img src="data:images/pic05.jpg" alt="上海丰田" /></li>
<li><img src="data:images/pic06.jpg" alt="奥迪" /></li>
<li><img src="data:images/pic07.jpg" alt="奔驰" /></li>
</ul>
</div><!--slide end-->
效果图：