原生js實現乙個DIV的碰撞反彈運動

2022-03-07 08:07:43 字數 1072 閱讀 7789

原生js實現乙個div的碰撞**運動:

關鍵在於div的邊界檢測,進而改變運動方向,即可實現碰撞**效果。

doctype html

>

<

html

lang

="en"

>

<

head

>

<

meta

charset

="utf-8"

>

<

title

>title

title

>

<

style

>

*div

/*新增絕對定位

*/style

>

<

script

>

window.onload

=function

()else

if(l

<=0)

if(t

>=

document.documentelement.clientheight

-div.offsetheight)

else

if(t

<=0)

div.style.left=l

+"px"

; div.style.top=t

+"px"

; },

10);}}

script

>

head

>

<

body

>

<

input

type

="button"

id="btn"

value

="開始運動"

>

<

div

id="div"

>

div>

body

>

html

>

用原生js實現乙個new?

js 還沒執行的時候,js 環境裡已經有乙個 window 物件了,window 物件有乙個 object 屬性,window.object 是乙個函式物件,window.object 這個函式物件有乙個重要屬性是 prototype,window.object.prototype 裡面有 tost...

用原生js實現乙個new方法

首先寫乙個父類方法 包含引數name,age function person name,age new乙個person的例項p1做研究對比 var p1 new person richard 22 此時p1包含name age屬性,同時p1的 proto 指向person的prototype p1....

用原生js實現乙個bind方法

bind 方法建立乙個新的函式,當被呼叫時,將其this關鍵字設定為提供的值,在呼叫新函式時,在任何提供之前提供乙個給定的引數序列。這段是來自mdn bind的介紹,我們可以理解bind方法返回乙個新的函式,這個函式內部的this指向提供的引數值,來看個例子 const person const g...