快捷導(dǎo)航

javascript 公用拖拽類代碼

更新時(shí)間：2008年12月10日 17:47:19 作者：

兼容Event對(duì)象等拖拽類代碼

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>D類</title> <style type="text/css"> html, body { margin:0; } </style>  </head> <body> <div style="position:relative; width:100px; height:100px; background-color:#000000;"> <div style="position:absolute; width:20px; height:20px; line-height:20px; left:50%; top:50%; margin:-10px 0 0 -10px; background-color:#F00; text-align:center; cursor:move;" onmousedown="var wc = this;D.start(wc, null, function (property) { var node = wc.parentNode; var a = D.pos(node), b = D.pos(wc); node.style.left = property.left - b.x + a.x + 'px'; node.style.top = property.top - b.y + a.y + 'px'; }, null);" >拽</div> </div> <div style="width:50px; height:50px; line-height:50px; text-align:center; background-color:#F00; position:absolute; cursor:move;" onmousedown="var wc = this;D.start(wc, null, function (property) { wc.style.left = property.left + 'px'; wc.style.top = property.top + 'px'; }, null);" >拽</div> <div style="height:1000px;"></div> </body> </html>

[Ctrl+A 全選注:引入外部Js需再刷新一下頁(yè)面才能執(zhí)行]

相關(guān)文章

如何使用big.js解決JavaScript浮點(diǎn)數(shù)精度丟失問(wèn)題
最近在項(xiàng)目中涉及到金額從元轉(zhuǎn)為分（乘100即可）,發(fā)現(xiàn)乘法居然也會(huì)有精度丟失的問(wèn)題,關(guān)于浮點(diǎn)數(shù)計(jì)算精度丟失是很多語(yǔ)言都存在的問(wèn)題,本文給大家分享使用big.js解決JavaScript浮點(diǎn)數(shù)精度丟失問(wèn)題,感興趣的朋友一起看看吧
2023-12-12
微信js-sdk界面操作接口用法示例
這篇文章主要介紹了微信js-sdk界面操作接口用法,結(jié)合實(shí)例形式分析了微信界面操作的相關(guān)接口功能與使用技巧,需要的朋友可以參考下
2016-10-10
JS實(shí)現(xiàn)HTML表格排序功能
這篇文章主要為大家詳細(xì)介紹了JS實(shí)現(xiàn)HTML表格排序功能，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2016-08-08
javascript截取字符串(通過(guò)substring實(shí)現(xiàn)并支持中英文混合)
用js方法substring()、方法substr()實(shí)現(xiàn)如標(biāo)題所示的截取字符串并支持中英文混合，具體代碼如下，感興趣的各位可以參考下哈
2013-06-06
元素綁定click點(diǎn)擊事件方法
當(dāng)點(diǎn)擊元素時(shí)，會(huì)發(fā)生 click 事件。當(dāng)鼠標(biāo)指針停留在元素上方，然后按下并松開(kāi)鼠標(biāo)左鍵時(shí)，就會(huì)發(fā)生一次 click。click() 方法觸發(fā) click 事件，或規(guī)定當(dāng)發(fā)生 click 事件時(shí)運(yùn)行的函數(shù)。
2015-06-06
javascript常用經(jīng)典算法實(shí)例詳解
這篇文章主要介紹了javascript常用算法,結(jié)合實(shí)例形式較為詳細(xì)的分析總結(jié)了JavaScript中常見(jiàn)的各種排序算法以及堆、棧、鏈表等數(shù)據(jù)結(jié)構(gòu)的相關(guān)實(shí)現(xiàn)與使用技巧,需要的朋友可以參考下
2015-11-11
uni-app中px與rpx的轉(zhuǎn)換方法
這篇文章主要給大家介紹了關(guān)于uni-app中px與rpx的轉(zhuǎn)換方法,rpx單位最初由微信推出,它與我們常用px一個(gè)很大的區(qū)別就是具有響應(yīng)式,需要的朋友可以參考下
2023-10-10
SOSO地圖JS畫(huà)出標(biāo)注和中心點(diǎn)以html形式運(yùn)行
SOSO地圖想必大家都知道吧，本文將為大家詳細(xì)介紹下使用JS畫(huà)出標(biāo)注和中心點(diǎn),直接貼出代碼，感興趣的朋友可以參考下
2013-08-08
一個(gè)仿微博登陸郵箱提示框js開(kāi)發(fā)案例
這篇文章主要為大家詳細(xì)介紹了一個(gè)仿郵箱登錄提示框js開(kāi)發(fā)案例，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2016-07-07
微信小程序sessionid不一致問(wèn)題解決
這篇文章主要介紹了微信小程序sessionid不一致問(wèn)題解決,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下
2019-08-08