[学习笔记]JavaScript基础--缓冲1

来源:互联网 发布:js中的对象是什么 编辑:程序博客网 时间:2024/06/03 05:30
<!DOCTYPE html><html><head>    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    <title></title>    <meta charset="utf-8" />    <style>        #div1 {            width: 100px;            height: 100px;            background: red;            position: absolute;            left: 0px;            top: 50px;        }               #div2 {            width: 1px;            height: 300px;            position: absolute;            background:black;            left: 300px;            top: 0;        }    </style>    <script>        function startMove()        {            var oDiv = document.getElementById('div1');            setInterval(function ()            {                var speed = (300 - oDiv.offsetLeft) / 10;              //speed = Math.ceil(speed); //向上取整                //speed = Math.floor(speed);//向下取整用                speed=speed>0?Math.ceil(speed):Math.floor(speed);                oDiv.style.left = oDiv.offsetLeft + speed + 'px';               document.title = oDiv.offsetLeft + ',' + speed;            },30);        }    </script></head><body>    <input  type="button" value="开始运动"  onclick="startMove()" />    <div id="div1"></div>    <div id="div2"></div></body></html>

0 0