滑鼠拖拽改變物件的屬性,滑鼠拖拽DIV移動

2022-02-03 05:07:37 字數 2149 閱讀 5458

/**常用document.onmousemove做的一些事情

*the time of writing:2013-4-11

*written by:吳志強

*/window.onload

=function

()

else

mousemove(odiv1, [

'left',

'top

'], ev,

function

());

//滑鼠拖動時執行函式

} }

= function (e)

//else

////

mousemove(odiv1, ['left', 'top'], ev, function (e));//滑鼠拖動時執行函式//}

//}odiv2.onmousedown

=function

(e)

else

mousemove(odiv2, [

'width',

'height

'], ev);}}

document.onmouseup

=function

() }

function

setattr(obj, aattr)

}else

}}function

mousemove(obj, aattr, e, fn)

);obj為被操作物件,aattr為要改變的屬性,為陣列, e為傳進來的瀏覽器物件, fn為每次執行mousemove後再執行的函式

可以滿足一些功能,具體功能就靠自己發掘啦,我就不說咯

你可以將上面被注釋的odiv1.onmousedown函式拿出來試試效果

*///

獲取mousemove時的x,y座標

vare =e

||event;

e.x

=e.clientx;

e.y

=e.clienty;

for(

vari=0

; i<

aattr.length; i++)

}if(fn)

}script

>

head

>

<

body

>

<

textarea

name

=""id

="txt1"

>

textarea

>

<

div

id="div1"

>div1

div>

<

div

id="div2"

>div2

div>

<

div

id="div3"

>div3

div>

<

div

id="div4"

>div4

div>

body

>

html

>

js滑鼠拖拽事件

只記錄left,top同理。clientx 返回滑鼠相對於瀏覽器的水平座標 offsetleft 返回當前物件距離瀏覽器 父物件 的左側距離 offsetwidth 物件的可見寬度 onmousemove 滑鼠移動事件 連線點是滑鼠放在div上拖動時的位置 座標 不會改變的,起名字為unchangx...

滑鼠拖拽div元素

上圖中綠色箭頭指向的分別是3個事件,大概的意思是 滑鼠單擊div box元素後,啟用了document.onmousemove滑鼠移動事件,在移動滑鼠時,會改變div box的left top值,從而達到div box元素隨著滑鼠移動。單滑鼠放開時觸發了document.onmouseup滑鼠鬆開事...

selenium 模擬滑鼠拖拽

1 從乙個元素拖拽到另乙個元素 from selenium import webdriver from selenium.webdriver import actionchains import time browser webdriver.chrome try browser.get browse...