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+"張照片"); }
結果如圖:
閱讀更多 專業技術交流 的文章
關鍵字: CSS JavaScript 蘋果公司