快捷導(dǎo)航

javascript 公用拖拽類代碼

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

兼容Event對象等拖拽類代碼

<!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需再刷新一下頁面才能執(zhí)行]

相關(guān)文章

three.js安裝和使用完整步驟
Three.js是一個(gè)JavaScript庫,用于在Web瀏覽器中創(chuàng)建3D Web圖形,下面這篇文章主要給大家介紹了關(guān)于three.js安裝和使用的相關(guān)資料,文中通過代碼介紹的非常詳細(xì),需要的朋友可以參考下
2023-11-11
如何通俗的解釋TypeScript 泛型
這篇文章主要介紹了TypeScript 泛型，對泛型感興趣的同學(xué)，可以參考下
2021-05-05
JavaScript實(shí)現(xiàn)標(biāo)簽頁切換效果
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)標(biāo)簽頁切換效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2021-10-10
fireworks菜單生成器mm_menu.js在 IE 7.0 顯示問題的解決方法
由于公司官網(wǎng)采用的是dreamwaver / fireworks 內(nèi)建的彈出式菜單的JS,在IE7下發(fā)現(xiàn)菜單項(xiàng)文字顯示都變成一排,無法正確瀏覽.
2009-10-10
使用js寫的一個(gè)簡易的投票
投票想必大家并不陌生吧，下面為大家介紹下使用js是如何寫一個(gè)簡易的投票
2013-11-11
在textarea文本域中顯示HTML代碼的方法
這篇文章主要為大家介紹下如果在textarea文本域中顯示HTML代碼，其實(shí)多用于網(wǎng)頁編輯的開發(fā)，大家可以參考下
2007-03-03
各種常用瀏覽器getBoundingClientRect的解析
getBoundingClientRect
2009-05-05
固定背景實(shí)現(xiàn)的背景滾動(dòng)特效示例分享
固定背景滾動(dòng)特效，使用background-attachment: fixed和導(dǎo)航菜單，頁面會(huì)非常平滑的滾動(dòng)，感興趣的朋友可以參考下哈希望對你有所幫助
2013-05-05
JS如何獲取指定范圍內(nèi)的隨機(jī)數(shù)含小數(shù)
這篇文章主要介紹了JS如何獲取指定范圍內(nèi)的隨機(jī)數(shù)含小數(shù)問題，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2022-12-12
JavaScript鍵盤事件響應(yīng)順序詳解
這篇文章主要為大家詳細(xì)介紹了JavaScript鍵盤事件響應(yīng)順序，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2019-09-09