js跑步算法的实现代码

前端技术 2023/09/01 JavaScript

先复制一下，看看运行的效果吧，其中用到的精髓是setInterval（）方法：

复制代码 代码如下:

<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01//EN\" \"http://www.w3.org/TR/html4/strict.dtd\">
<html>
<head>
<title>JavaScript</title>
<style>
html
{
background-color:silver;
}
.point1
{
position:absolute;
left:10px;
top:40px;

}
.point2
{
position:absolute;
left:100px;
top:40px;
}
.hr1
{
position:absolute;
top:60px;
}
</style>
<script type=\"text/JavaScript\">
document.onmousedown = mousedown;
document.onmouseup = mouseup;
var intervalProcess;
var direct = true;
function mousedown(){
intervalProcess = setInterval(\"MovePoint()\", 1);
}
function mouseup(){
clearInterval(intervalProcess);
}
function MovePoint(){
with (document.getElementById(\"point1\").style){
if (isNaN(parseInt(left)))
left = \"10px\";
else {
document.getElementById(\"point2\").style.left = \"200px\";
if (parseInt(left) < 0)
direct = true;
if (parseInt(left) > parseInt(document.getElementById(\"point2\").style.left))
direct = false;
if (direct)
left = parseInt(left) + 1 + \"px\";
else
left = parseInt(left) - 1 + \"px\";
}
}
}
</script>
</head>
<body>
<div class=\"point1\" id=\"point1\"><font color=blue>a</font></div>
<div class=\"point2\" id=\"point2\"><font color=red>b</font></div>
<hr class=\"hr1\" />
</body>
</html>

本文地址：https://www.stayed.cn/item/2188

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见，何事秋风悲画扇。

我的标签

随笔档案