<!doctype html><html><head><meta charset="utf-8"><title>无标题文档</title><style>#wed{ width:270px; height:480px;border:1px solid rgba(153,153,153,1);background-image:url(123.JPG)}</style></head><body><div id="wed" onMouseOver="bigg()" onMouseOut="smal()"></div><script>var wed=document.getElementById("wed"); // wed.style.backgroundImage="123.JPG"; //alert(wed.style.width)function bigg(){ do(wed.style.width=wed.offsetWidth+5+"px") while(wed.offsetWidth>540) do(wed.style.height=wed.offsetHeight+20+"px") while(wed.offsetHeight>960) setTimeout(bigg,10) }/**/function smal(){ do(wed.style.width=wed.offsetWidth-5+"px") while(wed.offsetWidth<270) do(wed.style.height=wed.offsetHeight-20+"px") while(wed.offsetHeight<480) setTimeout(smal,10) } </script></body></html>
2 回答
qq_非诚勿扰_3
TA贡献37条经验 获得超16个赞
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
#wed{
width:270px;
height:480px;
border:1px solid rgba(153,153,153,1);
background-image:url(123.JPG)
-webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
}
#wed:hover{
width:540px;
height:960px;
}
</style>
</head>
<body>
<div id="wed">
</div>
</body>
</html>
不知道这样行不行
添加回答
举报
0/150
提交
取消