js跑步算法的實(shí)現(xiàn)代碼
先復(fù)制一下,看看運(yùn)行的效果吧,其中用到的精髓是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>
相關(guān)文章
JavaScript事件 "事件對(duì)象"的注意要點(diǎn)
這篇文章主要介紹了JavaScript事件,告訴大家"事件對(duì)象"的注意要點(diǎn),感興趣的小伙伴們可以參考一下2016-01-01JavaScript中檢測(cè)數(shù)組的3種方法小結(jié)
數(shù)組檢測(cè)是指在編程中對(duì)數(shù)組進(jìn)行驗(yàn)證和檢查的過(guò)程,本文主要介紹了JavaScript中檢測(cè)數(shù)組的3種方法小結(jié),具有一定的參考價(jià)值,感興趣的可以了解一下2023-08-08js中如何對(duì)json數(shù)組進(jìn)行排序
這篇文章主要介紹了js中如何對(duì)json數(shù)組進(jìn)行排序的問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2023-04-04js中方法重載如何實(shí)現(xiàn)?以及函數(shù)的參數(shù)問(wèn)題
js中沒(méi)有辦法直接實(shí)現(xiàn)方法重載,但每一個(gè)函數(shù)都有一個(gè)特殊的參數(shù)arguments,利用它可以實(shí)現(xiàn)方法的重載,具體示例如下2013-08-08JSON+HTML實(shí)現(xiàn)國(guó)家省市聯(lián)動(dòng)選擇效果
實(shí)現(xiàn)國(guó)家省市聯(lián)動(dòng)的方法有很多,本文要為大家介紹的JSON+HTML如何實(shí)現(xiàn),需要的朋友可以參考下2014-05-05利用JS實(shí)現(xiàn)獲取當(dāng)前系統(tǒng)電量情況
在前端瀏覽器中我們可以通過(guò)使用JavaScript的navigator.getBattery()方法來(lái)獲取當(dāng)前系統(tǒng)的電池情況,本文將介紹如何使用這個(gè)API以及它在實(shí)際應(yīng)用中的使用,需要的可以參考下2023-12-12基于JavaScript實(shí)現(xiàn)購(gòu)物網(wǎng)站商品放大鏡效果
大家在日常生活中都有網(wǎng)購(gòu)的經(jīng)驗(yàn),有的網(wǎng)站會(huì)有商品放大鏡功能,效果非常棒,那么基于js代碼是如何實(shí)現(xiàn)的呢?下面小編給大家?guī)?lái)了基于js實(shí)現(xiàn)購(gòu)物網(wǎng)站商品放大鏡效果,非常不錯(cuò),感興趣的朋友參考下吧2016-09-09