問題描述
它應該是 CSS 和 JavaScript 的組合.要做的步驟應該是:
It should be a combination of CSS and JavaScript. The steps to do should be:
- 將其置于所有其他元素之上(指定哪個屬性?)
- 點擊事件時捕捉事件(監聽哪個事件?)
- 在鼠標移動時移動 div.
但是細節是什么?
推薦答案
jQuery之道:
查看 jQueryUI 插件 可拖拽和可拖拽.
已經在 jQuery 框架上投入了數百個小時，以使這樣的復雜任務變得微不足道.利用 jQuery 團隊的努力，讓我們所有人更輕松地編寫豐富的跨瀏覽器應用程序；)
Literally hundreds of hours have been invested into the jQuery framework to make complicated tasks like this almost trivial. Take advantage of the jQuery team's efforts to make programming rich cross-browser applications easier on us all ;)
如果您堅持使用原始 javascript 進行嘗試.你會想做一些事情.一，以編程方式將所有可拖動項目設置為相對/絕對定位.如果單擊特定項目，請使其在 CSS 中的頂部/左側值反映鼠標 x、y 軸所做的更改，直到釋放單擊為止.此外，您還需要更新每個可拖動對象的 z-index，以便在單擊它以將其顯示在視圖中時.
If you insist on trying this with raw javascript. You'll want to do a few things. One, programmatically set all draggable items to a relative/absolute positioning. If you click a particular item, cause it's top/left values in CSS to reflect the changes made by the x,y axis of the mouse until the click is released. Additionally, you'll want to update the z-index of each draggable when it's clicked to bring it into view.
教程:如何使用 Javascript 拖放
這篇關于如何使用 JavaScript 從頭開始??實現拖放 div?的文章就介紹到這了，希望我們推薦的答案對大家有所幫助，也希望大家多多支持html5模板網！