第43天 事件物件event

2021-09-20 08:36:40 字數 2035 閱讀 4432

一、事件物件

事件:onmouseover、 onmouseout、 onclick

event //事件的物件

相容寫法:var event = event || window.event;

event常見屬性,如下表:

屬性

作用

data

返回拖拽物件的url

字串(

dragdrop

)width

該視窗或框架的高度

height

該視窗或框架的高度

pagex

游標相對於該網頁的水平位置(ie

無)pagey

游標相對於該網頁的垂直位置(ie

無)screenx

游標相對於該螢幕的水平位置

screeny

游標相對於該螢幕的垂直位置

target

該事件被傳送到的物件

type

事件的型別

clientx

游標相對於該網頁的水平位置

(當前可見區域)

clienty

游標相對於該網頁的水平位置

二、pagex、 clientx、 screenx的區別

1、screenx 、screeny電腦螢幕為基準

2、pagex 、pagey文件(絕對定位)為基準 ie6、7、8不認識

3、clientx、   clienty可視區域為基準

三、其他事件

div.onmouseover

div.onmousemove

區別  

相同點都是經過  div 才會觸發

div.onmouseover只觸發一次

div.onmousemove每移動一畫素,就會觸發一次

onmouseup當滑鼠彈起   

onmousedown當滑鼠按下的時候  

1、拖動 原理

==   

滑鼠按下  接著 移動滑鼠 。

緩動動畫

35var

leaderx=0

;36varleadery=0

;37vartargetx=0

;38vartargety=0

;39setinterval(

function

(),10)45

46script

>

執行效果:

事件物件event

1.e.client 相對於當前頁面 視窗,不是這個元素 可視區域的左頂點 document.onmousemove function e 2.e.screen 相對於計算機螢幕的左頂點 document.body.onclick function e 3.offset 事件觸發時滑鼠距離該元素左邊...

事件物件(event)

再觸發dom上的某個事件時,會產生乙個事件物件event,這個物件中包含著所有與事件有關的資訊。所有瀏覽器都支援event物件,但支援的方式不同。1.事件物件的獲取 event的獲取 event內容重要內容 2.screenx pagex和clientx的區別 3.pagey和pagex的相容寫法 ...

事件Event物件

當事件發生時,會向呼叫函式傳遞乙個event物件,event 物件記錄當前事件發生時的環境資訊。乙個事件只能對應乙個event物件,並且event 物件是短暫存在的。dom中的 event 物件的使用方法 1 在html 標記中,通過事件來呼叫函式,向函式傳遞乙個 event 引數,該引數就是乙個 ...