Por que no me funciona este codigo que es para arrastrar un div:
El div que se arrastra:
Código HTML:
<div id="dragged" onmousedown="dragStart()" onmousemove="drag(event)"></div>
Div llamado scriptContainer:
Código HTML:
<div id="scriptContainer"></div>
Css:
Código HTML:
<style type="text/css">
#dragged{
position: absolute;
width: 100px;
height: 100px;
background: #FF0000;
cursor: move;
}
</style>
Script:
Código HTML:
<script language="javascript">
function dragStart() {
//Esta funcion hace que en el evento onMouseDown el innerHTML del div llamado scriptContainer sea otro script que es el que hace la funcion drag(event) en onMouseMove
document.getElementById('scriptContainer').innerHTML =
'<' + 'script' + '>' +
'function drag(e){' +
'var x = e.clientX;' +
'var y = e.clientY;' +
'document.getElementById("dragged").style.left = x - 50;' +
'document.getElementById("dragged").style.top = y - 50;' +
'}' +
'</' + 'script' + '>';
}
</script>
No entiendo por que no funciona, podrian ayudarme?