js写匀速运动中止

  • 时间:2018-06-06 01:50 作者:下班很无聊 来源:下班很无聊 阅读:83
  • 扫一扫,手机访问
摘要:一、HTML二、CSS#dog{display:block;width:100px;position: absolute;left: 0px;top:60px;}.bone{width: 100px;position:absolute;left: 410px;}三、scriptfunction st

一、HTML

二、CSS

#dog{

display:block;

width:100px;

position: absolute;

left: 0px;

top:60px;

}

.bone{

width: 100px;

position:absolute;

left: 410px;

}

三、script

js写匀速运动中止

js写匀速运动中止

function startMove(iTarget){

var oDog=document.getElementById('dog');

clearInterval(timer);

timer=setInterval(function(){

var iSpeed=0;

if (oDog.offsetLeft>iTarget) {

iSpeed=-7;

}

else{

iSpeed=7;

}

if (Math.abs(oDog.offsetLeft-iTarget)<7) {

clearInterval(timer);

oDog.style.left=iTarget+'px';

}

else{

oDog.style.left=oDog.offsetLeft+iSpeed+'px';

}

},30)

}

var timer=null;

window.onload=function(){

var oBtn=document.getElementById('btn1');

oBtn.onclick=function(){

startMove(330);

}

}

四、实际效果

js写匀速运动中止

有写的不对的地方,请大家指出,共同学习,共同进步;

喜欢请收藏,想看更多内容,请关注!

js写匀速运动中止

  • 全部评论(0)
最新发布的资讯信息
【系统环境|服务器应用】PHP和Python实战bcrypt算法(2019-02-01 20:47)
【系统环境|服务器应用】PostgreSQL数据库安装Version10.5(2019-02-01 20:47)
【系统环境|服务器应用】Notepad++快速选中多行(2019-02-01 20:47)
【系统环境|服务器应用】Clover支持目录多标签页(2019-02-01 20:47)
【系统环境|服务器应用】计算机视觉 OpenCV Android | Mat像素操作(2019-02-01 20:46)
【系统环境|服务器应用】PHP | 运算符 知识梳理与运用实例(2019-02-01 20:46)
【系统环境|服务器应用】人工智能通识-数学-零基础矩阵运算(2019-02-01 20:46)
【系统环境|服务器应用】Android-打包AAR步骤以及最为关键的注意事项!(2019-02-01 20:46)
【系统环境|服务器应用】回转寿司你肯定吃过!——Android消息机制(构造)(2019-02-01 20:46)
【系统环境|服务器应用】Android中不规则形状View的布局实现(2019-02-01 20:46)
手机二维码手机访问领取大礼包
返回顶部