我想看实例的代码代码呢？

源自：2-1 JS速度动画

我想看实例的代码代码呢？

为什么没有实例代码

提问者：苦闷di才华 2018-03-04 15:49

个回答

苦闷di才华

2018-03-04 17:47:38

谢谢后呀

0

五趾的鱼: 2018-03-04 17:33:23

<!doctype html>
<html>
<head>
<meta charset='utf-8'>
<title>送你了 </title>
</head>
<style>
#div1{
   width:300px;
   height:300px;
   background:red;
   filter: alpha(opacity:30);
   opacity:0.3;
}
</style>
<script>
window.onload=function(){
   var oDiv=document.getElementById('div1')
   oDiv.onmouseover=function(){
       startMove(100)
   }
   oDiv.onmouseout=function(){
       startMove(30)
   }
}
var alpha=30;
var timer='null';
function startMove(iTarget){
   var oDiv=document.getElementById('div1')
   clearInterval(timer)
   //开启一个定时器
   timer=setInterval(function(){
      var speed=0;

      if(alpha<iTarget){
         speed=10;
      }
      else{
         speed=-10;
      }

      if(alpha==iTarget){
         //停止这个定时器
         clearInterval(timer)
      }
      else{
         alpha+=speed;

         oDiv.style.filter='alpha(opacity:'+alpha+')';
         oDiv.style.opacity=alpha/100;
      }

   },30)
}
</script>
<body>
<div id='div1'>
</div>
</body>
</html>