Drag and Drop - texto e imagem para dentro de DIV

[jsmoraes]

Drag the W3Schools image into the rectangle:

Div recepetor

 - texto para drag

Código Fonte:

<nabble_embed><div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)">Div recepetor </div></nabble_embed>

<img src="http://jsmastronomy.30143.n7.nabble.com/file/n592/anim_claps.gif" id="drag1" draggable="true" ondragstart="drag(event)" style="cursor:grab;"/>

<span id="div2" draggable="true" ondragstart="drag(event)" width="336" height="69" style="cursor:grab;"> - texto para drag</span>
    <script type="text/javascript">
function allowDrop(ev) {
    ev.preventDefault();
}

function drag(ev) {
    ev.dataTransfer.setData("text", ev.target.id);
}

function drop(ev) {
    ev.preventDefault();
    var data = ev.dataTransfer.getData("text");
    ev.target.appendChild(document.getElementById(data));
}
</script>
<style>
#div1 {width:350px;height:70px;padding:10px;border:1px solid #aaaaaa;}
</style>