<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> div { width: 100px; height: 100px; background-color:pink; margin: 10px; float: left; border: 10px solid #000; } </style> <script> window.onload=function() { var div1=document.getElementById("div1");// var div2=document.getElementById("div2"); div1.onmouseover=function () { yundong(this,500); } div1.onmouseout=function () { yundong(this,100); } } function getStyle(obj,name) { if(obj.currentStyle) { return obj.currentStyle[name] } else { return getComputedStyle(obj,false)[name]; } } function yundong(obj,mubiao) { clearInterval(obj.timer); obj.timer=setInterval(function() { var cur=parseInt(obj.getStyle(obj,"height")); sudu=(mubiao-cur/6); sudu=sudu>0?Math.ceil(sudu):Math.floor(sudu); if(cur==mubiao) { clearInterval(obj.timer) } else { obj.style.height=cur+sudu+"px"; } },30) } </script></head><body><div id="div1">变高</div><div id="div2">变宽</div></body></html>
添加回答
举报
0/150
提交
取消