先复制一下,看看运行的效果吧,其中用到的精髓是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" />
</body>
</html>

相关文章:

  • 2022-12-23
  • 2022-12-23
  • 2021-11-12
  • 2021-08-05
  • 2022-12-23
  • 2021-11-20
  • 2021-09-14
  • 2022-01-15
猜你喜欢
  • 2022-12-23
  • 2022-01-29
  • 2021-09-02
  • 2022-12-23
  • 2022-02-21
  • 2022-01-26
相关资源
相似解决方案