我的網站下有幾大板塊，板塊的左上方有一個移動按鈕，請問如何實現可以拖拽div里的一個圖片使得整個div移動，drop后自動整理新的界面？ 如下圖：操作：在div 5 左上方的點點位置點擊(drag)拖動到div 3的位置后放手（drop）。希望的結果：div3和div5 交換，或者div5替換了div3的位置，之后的按順序排列。請大神越詳細越好，最好有例子或者范例。
2 回答
明月笑刀無情
TA貢獻1828條經驗 獲得超4個贊
拖放（Drag 和 drop）是 HTML5 標準的組成部分。
瀏覽器支持:Internet Explorer 9、Firefox、Opera 12、Chrome 以及 Safari 5 支持拖放。
被拖元素，dragElement :
(1)添加事件：ondragstart
(2)添加屬性：dragable
放置元素，dropElement:
1、添加事件：ondargenter , ondragover , ondragleave , ondragend ,ondrop
和mouser劃入劃出一類的事件很類似，字面也很好理解，不贅述了，下面會用例子來說明。
2、頁面上元素間的拖放
下面用個小例子，div間的拖放來展示，各個事件如何被觸發：
系統中選擇的一個或多個文件拖入該div中，files中會存儲拖入文件的信息，然后我們通過file可以得到文件的類型，長度，內容然后實現上傳。
3、setDragImage(image, x, y)用于設置鼠標移動過程中隨鼠標一起移動的效果圖。必須在dragstart中設置。
4、types,effectAllowed和dropEffect分別是拖入元素的類型，拖拽過程中鼠標顯示的樣式，不過通?？梢院雎赃@幾個屬性，一般用不到。
- 2 回答
- 0 關注
- 766 瀏覽
添加回答
舉報
0/150
提交
取消