码迷,mamicode.com
首页 > 其他好文 > 详细

弹性运动+摩擦力

时间:2015-04-27 11:18:30      阅读:142      评论:0      收藏:0      [点我收藏+]

标签:

  <!DOCTYPE html>
  <html>
  <head lang="en">
  <meta charset="UTF-8">
  <style type="text/css">
  #box{width:100px;height:100px;background:red;position: absolute;left:0;}
  span{height:900px;border-left:1px red solid;position: absolute;left:500px;}
  </style>
  <title></title>
  <script type="text/javascript">
  window.onload=function()
  {
  var oInput=document.getElementById("input1");
  var oDiv=document.getElementById("box");
  var timer=null;
  oInput.onclick=function()
  {
  startMove();
  };
  function startMove()
  {
  clearInterval(timer);
  var iSpeed=0;
  timer=setInterval(function()
  {
  iSpeed+=(500-oDiv.offsetLeft)/50;//弹性运动
  iSpeed*=0.95;//摩擦力
  oDiv.style.left=oDiv.offsetLeft+iSpeed+"px";
  },30)
  }
  }
  </script>
  </head>
  <body>
  <input type="button" value="开始运动" id="input1"/>
  <div id="box"></div>
  <span></span>
  </body>
  </html>

弹性运动+摩擦力

标签:

原文地址:http://blog.csdn.net/xiaomogg/article/details/45306739

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!