首先非常感谢网友Kevin的无私分享，此Jquery插件实现图片幻灯片功能，这是他写的第二款原创作品，插件命名为kevinSlide，可以灵活设置8个参数，页面上可以多次调用都不起冲突，为了方便大家学习用，页面上自带了5个demo
插件参数介绍如下：
/*
slide v 1.0
by Kevin Shi 2013-05-08 19:51:16
shiyongooo123@sina.com
幻灯片 (适合单个动画元素)
batObj (按钮元素)
batType (按钮类型:bat(按钮) num(数字按钮) img(图片))
moveType (动画方式:scroll(滚动)shade(渐变))
direction (方向:E(东)S(南)W(西)N(北))
preBat (上一个按钮元素)
nextBat (下一个按钮元素)
speed (动画速度)
time (间隔时间)
*/
页面5个Demo初始化代码如下：
$(function(){
$(".shade").kevinSlide({
batObj:".shadeBat",
batType:"num",
preBat:".shadePre",
nextBat:".shadeNext"
});
$(".W").kevinSlide({
batObj:".WBat",
batType:"bat",
moveType:"scroll"
});
$(".E").kevinSlide({
batObj:".EBat",
batType:"bat",
direction:"E",
time:0,
moveType:"scroll"
});
$(".S").kevinSlide({
batObj:".SBat",
batType:"bat",
direction:"S",
moveType:"scroll"
});
$(".N").kevinSlide({
batObj:".NBat",
batType:"bat",
direction:"N",
moveType:"scroll"
});
});
效果如下：
如果您觉得本作品对您的学习有所帮助：
关键字：
图片特效 幻灯片 无缝滚动 图片滚动 图片播放 图片轮播 Jquery焦点图 banner横向滚动 网友Kevin