作者TonyQ (骨头)
看板Web_Design
标题Re: [问题] javascript 拖拉图片
时间Sun Apr 13 05:10:36 2008
※ 引述《hsnucsc (hsnugo)》之铭言:
: 请问如果希望可以拖拉网页上的图片 各位会怎麽作
: 我想到的方法是把mouseDown时 设一个flag
: move时 style的position跟着改变
: 但是图片仍无法动
: <div id="pos" style="position:absolute;left:0px;right:0px">
: <img src="a.bmp" onmousedown=down() onmouseup=up() onmousemove=move()>
: </div>
: 请问是哪里出问题了 非常谢谢
以下假设 node是目标物
drag的原理是
node的onmousedown ->
设event给body(或上层元件,视需求)的onmousemove 。
(在这个move处理node的移动,因为node的move()
要在node的范围内才有效,会被局限住,所以要取上层。)
然後node的onmouseup release掉body的 onmousemove。
至於兼顾ie跟fx的event handle其实也很简单,
ie的event model是透过window.event,
而fx则是采用透过event obj(也就是底下的e)的方式。
function eventHandler(e) {
e = e ? e : window.event;//for ie-fx兼容
/* do something */
}
这是之前研究
http://www.webtoolkit.info/javascript-drag-and-drop.html
他的原始码所得到的结论,原po可以参考看看,
这个source没有用任何lib,而且code写的很简洁,还蛮具有参考价值得。
--
▄▅▆▇███▇▆▅▄▃ ╰┼╯─╮ ╮
◥███████████◣ ╰┼╯=│=│
◥██████───────◣ *. ╯ ╯ ╯ の 物 语 .*
◥███████──────◣ ~ ◢◣ ◢◣
◥██████───────◤ ◥◤* 空白的世界.翼
*◥◤
◥██▁▂▃▄▅▆▇███▆▅▄▃▂▂
~telnet://tony1223.no-ip.info
--
※ 发信站: 批踢踢实业坊(ptt.cc)
◆ From: 220.134.27.68