标签：style blog color io os ar div art sp
这个实现效果是在老师的提点下完成的，当时自己一直陷入在怎样才能够实现匀减速运动中不能出来，代码中的亮点已经表明……欢迎大家指正交流……
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>减速运动</title> <style> *{ margin:0; padding:0; } #oplay{ width:200px; height:200px; position: absolute; left:0; background-color: #B7B7B7; } #start_btn{ position: absolute; top:220px; font-size: 16px; } </style> </head> <body> <div id="oplay"></div> <button id="start_btn">开始运动</button> <script> var oplay = document.getElementById("oplay"); var start_btn = document.getElementById("start_btn"); var interval,speed; start_btn.onclick = function(){ clearInterval(interval); interval = setInterval(function(){ if(oplay.offsetLeft>=300){ clearInterval(interval); }else{ //这个地方是关键，怎样才能够使speed在移动元素在停止的时候正好速度为0 speed = (300-oplay.offsetLeft)/10; oplay.style.left = oplay.offsetLeft+speed+"px"; } },30); } </script> </body> </html>
标签：style blog color io os ar div art sp
原文地址：http://www.cnblogs.com/bjchenxn/p/3975336.html
