基于jquery创建的一个图片、视频缓冲的效果样式插件

(function($){
$.fn.scrollWait=function(options){
varops=$.extend({},$.fn.scrollWait.defaults,options);
varopts=$.meta?$.extend({},ops,$(this).data()):ops;
/**
*显示位置
*/
varwin=$(window);
varwinheight=win.height();
varwinwidth=win.width();
vardsize=opts.size;
vartop=opts.top;
varleft=opts.left;
vardtop=!top&&top!=""&&typeoftop!="undefined"&&top!=0
?(winheight-dsize)/2
:top;
vardleft=!left&&left!=""&&typeofleft!="undefined"
&&left!=0?(winwidth-dsize)/2:left;
//原点数量
varnum=opts.num;
//原点直径
varR=dsize/num*opts.areaWeight;
//半径
varr=1/2*R;
//外侧圆直径
varouterR=1/2*dsize;
//内侧圆直径
varinnerR=outerR-R;
//遍历添加原点对象
for(vari=0;i<num;i++){
$("body").append($("<divclass=\"innerCircle\"id=\"innerCircle"
+i+"\"></div>"));
}
//其实坐标0,0
vari=0;
varinnerArray=newArray(num);
/**
*计算内圆上个点的中心坐标
*/
for(varj=0;j<innerArray.length;j++){
varx,y;
varang=i*360/num;
if(0<=ang&&ang<=90){
x=outerR*Math.sin(ang/180*Math.PI)+outerR;
y=outerR-outerR*Math.cos(ang/180*Math.PI);
}
if(90<ang&&ang<=180){
x=outerR*Math.cos((ang-90)/180*Math.PI)+outerR;
y=outerR*Math.sin((ang-90)/180*Math.PI)+outerR;
}
if(180<ang&&ang<=270){
x=outerR-outerR*Math.sin((ang-180)/180*Math.PI);
y=outerR*Math.cos((ang-180)/180*Math.PI)+outerR;
}
if(270<ang&&ang<=360){
x=outerR-outerR*Math.cos((ang-270)/180*Math.PI);
y=outerR-outerR*Math.sin((ang-270)/180*Math.PI);
}
innerArray[j]=newArray(dtop+y-r,dleft+x-r);
i++;
}
/**
*画圆
*/
$(".innerCircle").each(function(){
$(this).css({
"width":R+"px",
"height":R+"px",
"border-top-left-radius":r+"px",
"border-top-right-radius":r+"px",
"border-bottom-left-radius":r+"px",
"border-bottom-right-radius":r+"px"
});
});
for(vari=0;i<num;i++){
$("#innerCircle"+i).css({
"top":innerArray[i][0]+"px",
"left":innerArray[i][1]+"px"
});
}
//查找当前暂停的圆的位置
varval=$("#current").val();
if(val==undefined||val==""){
$("body").append($("<inputtype=\"hidden\"id=\"current\">"));
k=0;
}else{
k=val;
}
varo=newObject();
vartimer;
//开始旋转
o.start=function(){
varfirst;
varg=$("#grade").val();
if(g==undefined||g==""){
$("body").append($("<inputtype=\"hidden\"id=\"grade\">"));
first=1;
}else{
first=g;
}
timer=setInterval(function(){
if(first%2==1){
$("#innerCircle"+k).removeClass("innerCircle")
.addClass("innerCircle-change");
}
if(first%2==0){
$("#innerCircle"+k).removeClass("innerCircle-change")
.addClass("innerCircle");
}
if(k==(num-1)){
k=0;
console.log(first);
first++;
$("#grade").val(first);
}else{
k++;
}
//覆盖值
$("#current").val(k);
},opts.speed);
returnthis;
}
//暂停
o.stop=function(){
clearInterval(timer);
returnthis;
}
//结束
o.end=function(){
clearInterval(timer);
//移除所有元素
$(".innerCircle,.innerCircle-change,#current,#grade").remove();
}
returno;
}
$.fn.scrollWait.defaults={
size:80,
top:null,
left:null,
//数量
num:8,
speed:200,
//圆点占整个面积的比重
areaWeight:5/4
};
})(jQuery);