jQuery多功能地图转盘插件
这是一个多功能幻灯片插件,支持多种配置,CSS样式是捡上网,原代码里面,轻喷~(函数($){)
使用严格;
var方法= {
O:{
下一步:#周期下
沪指:#周期沪指
传呼:#周期净值
滑块:#美滑块
时间表:#时间表
innertimeline:#内时间
timelinenode:#时间节点
SliderItemClass:slideritem
nodeactive:node_active
显示:{淡出:淡入
NavHtml:
NavConfig:{ navboxclass:周期导航
},
generateid:函数(){
返回+新的日期()GetTime();
},
generatetemplate:功能(ID,设置){
Var HTMLs =新的数组();
Htmls.push();
Htmls.push();
Htmls.push();
如果(设置。isarrow){
Htmls.push('prev);
Htmls.push(下);
}
如果(设置。showtimeline){
Htmls.push();
Htmls.push();
Htmls.push();
Htmls.push();
}
如果(设置。isnav){
Htmls.push();
}
Htmls.push();
Htmls.push();
Htmls.push();
HTMLs回来了;
},
函数(DOM,选项){
var =;
VaR默认= {网址:数据:汽车{ },,:假,时间:2000、覆盖:假,isarrow:真的,isnav:真的,showtimeline:假,假,showtip:键盘:真的,显示:s.o.displays.fade,navconfig:s.o.navconfig };
var设置(默认值、扩展名、选项);
var id = s.generateid();
$();
无功imgarray = s.returnimgarray(DOM,设置);
如果(imgarray!= null imgarray.length > 0){
的{imgcnt+身份证} = imgarray.length;
$(DOM),Html(s.generatetemplate(ID,设置)。加入(')),表明();
VaR(s.o.slider滑块=美元+身份证);
VaR(s.o.pager寻呼机=美元+身份证);
无功timelinenode = $(s.o.timelinenode +身份证);
s.o.innerw = $(DOM),Width(20);
无功imghtml = ;
无功pagehtml = ;
无功timehtml = ;
美元。每个(imgarray,功能(指标项){
无功picclass =指数s.o.slideritemclass = = 0:s.o.slideritemclass +没有;
无功navclass =指数settings.navconfig.navactiveclass = = 0:;
imghtml + =;
pagehtml = s.o.navhtml.replace(设置。navconfig shownum 。
VaR左= s.o.innerw *指数 / S {imgcnt+身份证} 13;
无功nodeclass =指数s.o.nodeactive = = 0:;
timehtml + =;
如果(设置。showtip){
timehtml + =+ item.title +;
}
timehtml + =;
});
Slider.html(imghtml);
如果(设置。isnav){
如果(设置。navconfig。navboxclass){
Pager.removeClass(s.o.navconfig。navboxclass)。AddClass(设置。navconfig。navboxclass);
}
Pager.html(pagehtml);
}
如果(设置。showtimeline){
timelinenode.html(timehtml);
}
Slider.width(s.o.innerw);
Slider.find(,+ s.o.slideritemclass)。Width(s.o.innerw);
$(s.o.timeline +身份证)Width(s.o.innerw);
如果(设置覆盖){
如果(美元。FN。模型){
$(DOM),LayerModel({ staysame:真的,blurclose:true});
{人}
警报(请介绍模型插件!)
}
}
S.initBind(ID,设置);
的{currentindex+身份证} = 0;
无功总= settings.time / 1000×{imgcnt+身份证};
如果(设置自动){
如果(设置。showtimeline){
S.startTimeLine(ID,总,设置);
{人}
s.o.timeinterval = window.setinterval(函数(){()
$(#周期的下一个Click()+身份证);
},设置时间;
}
}
{人}
返回;
}
返回DOM;
},
starttimeline:功能(ID、时间、设置){
var =;
innertimeline = $(var $ s.o.innertimeline +身份证);
无功crnw = innertimeline.width美元();
对于(var i = 0;我<的{imgcnt+身份证};i++){
VaR该= math.floor(s.o.innerw *我的{imgcnt+身份证});
如果(crnw = =该){
的{currentindex+身份证} =我;
S.updateImgLink(ID,设置);
$(s.o.timelinenode +身份证),(div.node)。Eq(我),AddClass(s.o.nodeactive)。兄弟姐妹()RemoveClass(s.o.nodeactive);
}
}
如果(crnw < s.o.innerw){
innertimeline.animate美元({宽度:+ = 1px},时间,'linear,函数(){()}
S.startTimeLine(ID、时间、设置);
});
{人}
(0)innertimeline.width美元;
S.startTimeLine(ID、时间、设置);
}
},
InitBind:功能(ID,设置){
var =;
无功iseasing =美元。easing.def;
如果(设置。isarrow){
$(#周期沪指+身份证+
$(。cycleslider包)。Hover(function(){)
$(#周期沪指+身份证),停止()。动画({左:31
$(#周期下+身份证),停止()。动画({右:31
}函数(){()
$(#周期沪指+身份证),停止()。动画({左:50
$(#周期下+身份证),停止()。动画({右:50
});
$(#周期沪指+身份证),Bind(单击
的{currentindex身份} = { 的currentindex+imgcnt身份}的{ 0 } 1:+ ID的{currentindex+身份证} 1;
S.updateImgLink(ID,设置);
});
$(#周期下+身份证),Bind(单击
的{currentindex+身份证} = { 的currentindex+身份证}的{ << imgcnt+身份证} 1 {currentindex+身份证} + 1:0;
S.updateImgLink(ID,设置);
});
}
$(滑块换行符);
$(
如果($(this)。HasClass(s.o.navconfig。navactiveclass)){
返回false;
}
的{currentindex+身份证} = $(this)指数();
S.updateImgLink(ID,设置);
});
如果(settings.auto设置。showtimeline){
$(div.node
单击:函数(){
如果($(this)。HasClass(s.o.nodeactive)){
返回false;
}
的{currentindex+身份证} = $(this)指数();
S.updateImgLink(ID,设置);
},
鼠标悬停:函数(){
如果(设置。showtip){
$(这)找到(。提示)FadeIn();
}
},
Mouseout:函数(){
如果(设置。showtip){
$(这)找到(。提示)FadeOut();
}
}
});
}
键盘
如果(设置键盘){
$(窗口),Keydown(函数(事件){
< <
如果(的情况下= = 37){
$(#周期沪指+身份证)Click();
}
如果(的情况下= = 39){
$(#周期的下一个Click()+身份证);
}
});
}
},
UpdateImgLink:功能(ID,设置){
var =;
VaR指标= S {currentindex+身份证};
VaR = settings.display;
无功iseasing =美元。easing.def;
var $项目= $(div+ s.o.slideritemclass,s.o.slider +身份证);
开关(显示){
案例s.o.displays.fade:
items.eq美元(指数),(),()()兄弟姐妹。隐藏;
打破;
案例s.o.displays.left:
items.css美元({位置:绝对
items.eq美元(指数),动画({ 0 },左:100,iseasingeaseoutcubic :)显示();
$(s.o.slider +身份证),高度(s.getimgmaxheight(ID));
打破;
案例s.o.displays.right:
items.css美元({位置:绝对
items.eq美元(指数),动画({ 0 },右:100,iseasingeaseoutcubic :)显示();
$(s.o.slider +身份证),高度(s.getimgmaxheight(ID));
打破;
案例s.o.displays.top:
打破;
案例s.o.displays.bottom:
打破;
违约:
打破;
}
$(
更新进度条信息
如果(settings.auto设置。showtimeline){
无功indexwidth = math.floor(s.o.innerw *指数 / S {imgcnt+身份证});
$(s.o.innertimeline +身份证),动画({宽度:indexwidth +PX},500,'linear,函数(){){
$(s.o.timelinenode +身份证),(div.node)。情商(指数),AddClass(s.o.nodeactive)。兄弟姐妹()RemoveClass(s.o.nodeactive);
});
}
},
GetImgMaxHeight:功能(ID){
var =;
VaR(s.o.slider滑块=美元+身份证);
VaR最大高度= 0;
美元。每个(slider.find(IMG),功能(指标项){
无功imgheight = this.height;
最大高度= math.max(最大高度,imgheight);
});
返回的最大高度;
},
returnimgarray:功能(DOM,设置){
var =;
无功imgarray =新的数组();
var url = settings.url;
如果(s.isparamvalid(URL)){
$ ajax({
网址:网址+=+新的日期()GetTime(),
类型:'post,
异步:假,
数据:settings.data,
DataType:'json,
成功:函数(数据){
如果(s.isparamvalid(数据)){
$(数据、函数(索引、项){)
ImgArray.push(项);
});
}
},
错误:函数(){
警报(无效的图片数据源地址);
返回null;
},
完成:功能(XHR,TS){ XHR = null;}
});
{人}
VaR IMGS = $(DOM),找到(IMG);
如果(IMGS!= null imgs.length > 0){
美元。每个(IMGS,功能(I,O){
新对象();
pic.picurl = $(O)。母(),Attr(href);
pic.picpath = $(O),Attr(src);
pic.width = $(O),Attr(宽度);
pic.height = $(O),Attr(高度);
pic.title = $(O),Attr(标题);
ImgArray.push(PIC);
});
}
}
返回imgarray;
},
IsParamValid:功能(v){
返回!(V = =V| | | | = = null V = =未定义);
}
};
美元。fn.beautyfocus =功能(选项){
返回this.each(功能(指标项){
Methods.init(项目选择);
});
};
}(jQuery);
以上是本文的全部内容,希望大家能喜欢。