zoukankan      html  css  js  c++  java
  • 缓冲运动

     1 <!DOCTYPE html>
     2 <html>
     3     <head>
     4         <meta charset="utf-8">
     5         <title></title>
     6         <style>
     7             #div1{width: 100px; height: 100px;background-color:red;position: absolute;
     8             left: 600px;top: 50px;}
     9             #div2{width: 1px; height: 300px;background-color:black;position: absolute;
    10             left: 300px;top: 0px;}
    11         </style>
    12         <script>
    13             function startMove(){
    14                 var oDiv=document.getElementById('div1');
    15                 setInterval(function(){
    16                     var speed=(300-oDiv.offsetLeft)/10;
    17                     speed=speed>0?Math.ceil(oDiv.offsetLeft+speed):Math.floor(oDiv.offsetLeft+speed);
    18                     oDiv.style.left=speed+'px';
    19                 },30)
    20             }
    21         </script>
    22     </head>
    23     <body>
    24         <input type="button" value="缓冲运动" onclick="startMove()" />
    25         <div id="div1">
    26         </div>
    27         <div id="div2">
    28         </div>
    29     </body>
    30 </html>
    View Code
  • 相关阅读:
    栈和队列
    链表
    map
    二叉平衡树旋转
    二叉排序树详情
    红黑树详情
    查并集
    动态规划
    位操作
    字典树
  • 原文地址:https://www.cnblogs.com/shangec/p/12792340.html
Copyright © 2011-2022 走看看