基于jQuery大众型slider实现,只需在使用时更改CSS。
两三年前写的一个插件,这个插件是我写的第一个可复用的JS,后来工作性质变了,不再使用到幻灯片。
昨天看到了这个插件,抽时间把这块重写了一下,优化后的文件名:Au_slider2.0。
文件本身并不大,只是用了一些高清的图片。JS未压缩只有7kb
注:console.log在IE中支持 的并不好,在项目中用到的时候,需要将这类代码注掉
@baukh20140710:修复IE7下样式问题。
/* @baukh20140625 Au_slider:幻灯插件 init方法中arg参数说明 $arg.sliderArea :幻灯区域 $arg.slider_img :图片区 $arg.slider_name :名称区 $arg.slider_change :切换区 $arg.sliderTime :动画切换时间 $arg.isAutoChange :是否自动切换 $arg.isShowNum :是否在切换区显示图片排序 */
$(function(){
//调用方法,可以传参
/*
传参方法
var pre={
sliderArea :幻灯区域
slider_img :图片区
slider_name :名称区
slider_change :切换区
sliderTime :动画切换时间
isAutoChange :是否自动切换
isShowNum :是否在切换区显示图片排序
}
*/
var pre = {
sliderTime : 2000,
isAutoChange : true,
isShowNum : true
}
Au_slider.init(pre);
})
/*
*/
var pre = {
sliderArea :'.s1',
sliderTime : 2000,
isAutoChange : true,
isShowNum : true
}
Au_slider.init(pre);
var pre = {
sliderArea :'s2',
sliderTime : 3000,
isAutoChange : true,
isShowNum : true
}
Au_slider.init(pre);
/*
通过配置不同的sliderArea的幻灯容器
并分别加域,需要注意的是如果存在多个幻灯时,需进行多次初始化。
*/
var pre = {
sliderArea :'.s1',
sliderTime : 2000,
isAutoChange : true,
isShowNum : true
}
Au_slider.init(pre);
var pre = {
sliderArea :'.s2',
sliderTime : 3000,
isAutoChange : true,
isShowNum : true
}
Au_slider.init(pre);
1651

被折叠的 条评论
为什么被折叠?



