window.onload=function(){

var oMemu=document.getElementById("memu");

var aImag=document.getElementsByTagName("img");

var aWidth=[];

var i=0;

//保存每张照片原宽度,并设置当前宽度.

for(i=0;i

aWidth.push(aImag[i].offsetWidth);//采用数组的push方法将当前照片宽度保存到数组中

aImag[i].width=parseInt(aImag[i].offsetWidth/2);//重新设置照片宽度

}

//鼠标移动事件

oMemu.onmousemove=function(event){//Event 对象代表事件的状态,比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。

var Event=event||window.event;//在ie下，事件对象是在全局的，也就 window下，做为window的一个属性在其他浏览器，都做为方法的第一个参数传入，所以这样写是为了兼容

for(i=0;i

var a=Event.clientX-aImag[i].offsetLeft-aImag[i].offsetWidth/2;

var b=Event.clientY-aImag[i].offsetTop-aImag[i].offsetHeight/2-oMemu.offsetTop;

var iScale=1-Math.sqrt(a*a+b*b)/300;

if(iScale<0.5) iScale=0.5

aImag[i].width=aWidth[i]*iScale;

}

};

};

//简单的一个弹窗.传入一个参数

function fun(m){

alert("这是第"+m+"张照片");

}

结果如图：

閱讀更多 專業技術交流 的文章

關鍵字: JavaScript HTML 苹果公司