没有合适的资源?快使用搜索试试~ 我知道了~
浅谈Javascript中匀速运动的停止条件
0 下载量 193 浏览量
2020-12-11
00:34:43
上传
评论
收藏 50KB PDF 举报
温馨提示
试读
2页
我们先来看下之前的匀速运动的代码,修改了速度speed后会出现怎么样的一个bug。这里加了两个标杆用于测试 代码如下: <style type=”text/css”> #div1 { width: 100px; height: 100px; position: absolute; background: red; top: 50px; left: 600px;
资源详情
资源评论
资源推荐
浅谈浅谈Javascript中匀速运动的停止条件中匀速运动的停止条件
我们先来看下之前的匀速运动的代码,修改了速度speed后会出现怎么样的一个bug。这里加了两个标杆用于测试
代码如下:
<style type=”text/css”>
#div1 {
width: 100px;
height: 100px;
position: absolute;
background: red;
top: 50px;
left: 600px;
}
#div2 {
width: 1px;
height: 300px;
position: absolute;
left: 300px;
top: 0;
background: black;
}
#div3 {
width: 1px;
height: 300px;
position: absolute;
left: 100px;
top: 0;
background: black;
}
</style>
<script type=”text/javascript”>
var time = null;
function startMove(iTarget) {
var oDiv = document.getElementById(“div1”);
clearInterval(time);
time = setInterval(function() {
var speed = 0;
if (oDiv.offsetLeft < iTarget) {
speed = 7;
} else {
speed = -7;
}
// 其实这种情况是有问题的
oDiv.style.left = oDiv.offsetLeft + speed + ‘px’;
}, 30)
}
</script>
</head>
<body>
<input type=”button” id=”btn” value=”到100″ onclick=”startMove(100)” />
<input type=”button” id=”btn” value=”到300″ onclick=”startMove(300)” />
<div id=”div1″>
</div>
<div id=”div2″>
</div>
<div id=”div3″>
</div>
</body>
其实这样的代码如果把速度改成7这种奇数,而到达目标点却是一个整数,这样就会出现未能达目标点或超过目标点来回抖动
的bug
weixin_38651812
- 粉丝: 3
- 资源: 935
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
最新资源
- 智能卡管理工具 - 野火2019专业版软件
- Android平台上的百度地图定位演示案例
- 全国 31省市场分割指数2004-2022年
- 华夏ERP基于SpringBoot框架和SaaS模式立志为中小企业提供开源好用的ERP软件
- Android光学字符识别(OCR)工具或库
- 基于C语言+STM32实现的智能自平衡小车+源码解析+超声波避障+超声波跟随+蓝牙遥控等功能+硬件资料+仿真(高分优秀项目)
- C# 屏幕录制 AForge.NET Framework-2.2.5
- 全国31省-环境污染综合指数(2008-2022年).zip
- 校园小情书微信小程序源码 - 社区小程序前后端开源 - 校园表白墙交友小程序
- 基于java的进销存管理系统软件源码+课设文档资料.zip
资源上传下载、课程学习等过程中有任何疑问或建议,欢迎提出宝贵意见哦~我们会及时处理!
点击此处反馈
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功
评论0