首頁  >  文章  >  web前端  >  JS實作靜止元素自動移動範例_javascript技巧

JS實作靜止元素自動移動範例_javascript技巧

WBOY
WBOY原創
2016-05-16 16:52:221043瀏覽

一個元素是靜止的,使它在螢幕上實現自動移動。

這是一個比較簡單問題,在學習中遇到了,把它寫了下來。

複製程式碼 代碼如下:











<script> <BR>var timenum; <BR>var mar=0;//控制移動量的變數<BR>var flag = 0 ;//實作控制左右移動的變數<BR>//實作向右移動的函式<BR>function moveright(){ <BR>sp1.style.marginLeft=mar "px"; <BR>mar=mar 5 ; <BR>} <BR>//實現向右移動的函數<br>function moveleft(){ <br>sp1.style.marginLeft=mar "px"; <BR>mar=mar-5; <BR> } <BR><BR>function go() { <BR>var sp1 =document.getElementById("sp1"); <BR>var btn1 = document.getElementById("start"); <BR>if(!btn1. disabled){ <BR>btn1.disabled = true; <BR>document.getElementById("pause").disabled=false; <BR>} <BR>sp1.innerHTML=parseInt(sp1.innerHTML) 1 <37HTML); timenum = window.setTimeout(go,10); <BR>if(flag==1){ <BR>window.setTimeout(moveleft,10); <BR>} <BR>if(flag==0){ <BR>window.setTimeout(moveright,10); <BR>} <BR>if(mar>(window.outerWidth)){ <BR>flag=1; <BR>} <BR>if(mar<0){ <BR>flag=0; <BR>} <BR>} <BR>function stop(){ <BR>document.getElementById("start").disabled = false; <BR>document.getElementById("pause") .disabled=true; <BR>window.clearTimeout(timenum); <BR>} <BR></script>





0
陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn