dw如何点击图片放大的代码_Dreamweaver 如何做到图形放大缩小的交互效果

【第四步】回到Dreamweaver  软件界面，在body标签前面适当位置输入：

window.οnlοad=function(){

var btn=document.getElementById("btn")

var one=document.getElementById("one")

one.οnmοuseοver=function(){

startMove(one,{width:400,height:400})

}

one.οnmοuseοut=function(){

startMove(one,{width:100,height:100})

}

function getstyle(obj,name){

if(obj.currentStyle){

return obj.currentStyle[name];

}

else{

return getComputedStyle(obj,null)[name]

}

}

var timer=null;

function startMove(obj,json,fun){

clearInterval(timer);

timer=setInterval(function(){

for(var att in json){

var cur=parseInt(getstyle(obj,att))

var speed=(json[att]-cur)/10;

speed=speed>0?Math.ceil(speed):Math.floor(speed);

if(cur==json[att]){

clearInterval(timer);

if(fun){

fun();

}

}

else{

obj.style[att]=cur+speed+"px";

}

}

},30)

}

}；

保存并摁F12键，跳转到页面，光标在图形上进出移动，可看到图形放大缩小。