Js图片切换特效中的左右箭头功能实现代码
function $(e){
return "string" == typeof e ? document.getElementById(e) : e;
}
var Event={
add:function (obj,EventType,fn){
if (obj.attachEvent){
obj['e'+EventType+fn] = fn;
obj[EventType+fn] = function() {obj['e'+EventType+fn](window.event);}
obj.attachEvent('on'+EventType,obj[EventType+fn]);
}else if(obj.addEventListener){
obj.addEventListener(EventType,fn,false);
}else{
obj['on'+EventType]=fn;
}
}
,
remove:function(obj,Event,fn){
if (obj.detachEvent){
obj.detachEvent('on'+EventType,obj[EventType+fn]);
}else if(obj.removeEventListener){
obj.removeEventListener(EventType,fn,false);
}else{
obj['on'+EventType]=null;
}
}
}
var Each=function(list,fn){
for(var i=0,len=list.length;i
fn(list[i],i)
}
}
Function.prototype.bind=function(object){
__method=this;args=Array.prototype.slice.call(arguments);args.shift();
return function (){
__method.apply(object,args.concat(Array.prototype.slice.call(arguments)));
}
}
var Class={
create:function (){
return function (){
this.initialize.apply(this,arguments);
}
}
}
ChangeImages=Class.create();
ChangeImages.prototype={
initialize:function (id,loader,arr){
var oThis=this;
this.idImg=$(id);
this.idLoader=$(loader);
this.arr=[];
this.pic=this.setDefault(arr);
Event.add(this.idImg,'load',function(){oThis.getPos()});
Event.add(this.idImg,'mousemove',function (event){oThis.SetHand(event)});
Event.add(this.idImg,'click',function (event){oThis.clickSet(event)});
Event.add(this.idImg,'click',function (event){oThis.SetHand(event)});
},
setDefault:function(arr){
this.count=0;//计数器
Each(arr,function (o){this.arr.push([o,false])}.bind(this))//这样写的好处是可以限定this的作用域
this.idImg.src=this.arr[0][0]; //设置图片默认为第一幅图
},
SetHand:function(event){
switch (this.count){
default:this.getNx(event);
break;
case 0:this.idImg.style.cursor="url(',
'//ku.shouce.ren/files/images/01/56a34a12a3a9e.jpg',
'//ku.shouce.ren/files/images/01/56a34a1327fbb.jpg',
'//ku.shouce.ren/files/images/01/56a34a13a0bb9.jpg',
'//ku.shouce.ren/files/images/01/56a34a1422687.jpg',
'//ku.shouce.ren/files/images/01/56a34a14d4ae1.jpg'
);
//建立一个图片翻页对象,第一个参数是主图片id，第二个是加载图片id，第三个是图片数组
objCI=new ChangeImages('viewImg','loader',arrImg);
