如下圖,點選向右,方塊向右移動,點選向左,方塊向左移動。
可以用setinterval來實現過多長時間,div移動多長的距離來實現運動效果。
要點一:如果元素的左邊距離小於目標距離,則是正向移動,否則是負向移動
if(run.offsetleft 要點二:如果元素的左邊距離等於目標距離,停止定時器,否則,元素的左邊距離等於現在的左邊距離加上速度值。
if(run.offsetleft ==target)
else
上**
doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "">無標題文件
title
>
<
style
>
body
#run
style
>
<
script
>
window.onload
=function
()btn1.onclick
=function
()function
startrun(target)
else
if(run.offsetleft
==target)
else
},30)}
}script
>
head
>
<
body
>
<
input
id="btn"
type
="button"
value
="運動向右"
>
<
input
id="btn1"
type
="button"
value
="運動向左"
>
<
div
id="run"
>
div>
body
>
html
>
用js實現簡單的點選返回頂部效果
當頁面特別長的時候,使用者想回到頁面頂部,必須得滾動好幾次滾動鍵才能回到頂部,如果在頁面右下角有個 返回頂部 的按鈕,使用者點選一下,就可以回到頂部,對於使用者來說,是乙個比較好的體驗。實現原理 當頁面載入的時候,把元素定位到頁面的右下角,當頁面滾動時,元素一直位於右下角,當使用者點選的時候,頁面回...
用js實現點選複製文字
function copytext ele else 移除選中的元素 window.getselection removeallranges 對於這段 的相容性,實際使用中對於大多的普通瀏覽器和android端都是比較相容的,但移動端uc和qq瀏覽器有乙個小問題,原因是因為uc中document.e...
JS 運動的實現
1.停不下來 給定時器新增timer 來判斷是否需要停止 2.到目的地,還能點選移動,把移動的 放入else中 3.重複點選按鈕會加速運動 是因為點一次就會啟動一次定時器,多次就會啟動多次 保證只有乙個定時器在啟動,啟動一次就關閉上一次啟動定時器 運動框架 1 啟動就關閉定時器 2 if else ...