當我們拖動它時爲對象造型

Question

我只想知道如何改變我們使用HTML5的拖放API拖動的對象的樣式。我在網上搜索，但什麼都沒找到！看了本教程，但它沒有給我關於在拖拽對象時設置對象的信息。

對此問題的任何解決方案？

此外，這可能嗎？

Answer 1

這是部分可能 在HTML5中，你不能改變鬼對象 的風格，但你可以改變從dataTransfer對象的 setDragImage方法默認鬼對象。 這裏製造的例子（拖當藍光DIV將成爲一個紅格）：

<style> 
     #div1{ 
     background-color:blue; 
     width:100px; 
     height:100px; 
     } 
     #div2{ 
     background-color:red; 
     width:100px; 
     height:100px; 
     } 
    </style> 
    ... 
    <div id="div1" draggable="true" ></div> 
    <br/> 
    <div id="div2" ></div> 
    <script> 
     document.getElementById('div1').addEventListener('dragstart', function(event) { 
     event.dataTransfer.setDragImage(document.getElementById('div2'),50,50); 
     }); 
    </script> 

http://jsfiddle.net/ftX3C/

所以你不能改變風格，但有從作爲使用隱藏的元素鬼影。它也可以是img或畫布。

我推薦以下教程關於HTML5拖放： http://www.html5rocks.com/en/tutorials/dnd/basics/

也瞭解dataTransfer對象完成該嘖嘖後： developer.mozilla.org/en-US/docs/Web/API/DataTransfer