Spostare il contenuto di un tag <div> con il mouse

Posted on 05. May, 2006 by Administrator in dhtml, javascript, tutorials


In questo articolo tratteremo come spostare il contenuto di un blocco di testo o
codice html contenuto all'internodell'attributo <div> con il mouse.

<html>
<head>
<script language="JavaScript">
var isMinNS4 = (document.layers) ? 1 : 0;
var isMinIE4 = (document.all) ? 1 : 0;

var mouseX = 0;
var mouseY = 0;

if (isMinNS4)document.captureEvents(Event.MOUSEMOVE);
document.onmousemove = getMousePosition;

function getMousePosition(e)
{
if (isMinNS4)
{
mouseX = e.pageX;
mouseY = e.pageY;
}
if (isMinIE4)
{
mouseX = event.clientX + document.body.scrollLeft;
mouseY = event.clientY + document.body.scrollTop;
}
return true;
}

function posiziona(){
var mezzanotaX=50;
var offsetY=10;
var ie4 = (document.all) ? true : false;
var ns4 = (document.layers) ? true : false;
var ns6 = (document.getElementById && !document.all) ? true : false;
if (ie4) {document.all['note'].style.left = mouseX-mezzanotaX;
document.all['note'].style.top = mouseY-offsetY;}
if (ns4) {document.layers['note'].left = mouseX-mezzanotaX;
document.layers['note'].top = mouseY-offsetY;}
if (ns6) {document.getElementById(['note']).style.left = mouseX-mezzanotaX;
document.getElementById(['note']).style.top = mouseY-offsetY;}
document.getElementById('note').onmousemove=posiziona;

}

function blocca(){
document.getElementById('note').onmousemove=null;
}
</script>
</head>

<body>

<div id="note"
style="position:absolute;cursor:hand;background-color:white;zindex:5;"
onMousedown="posiziona();" onMouseup="blocca();" onSelectStart="return false">
Qui va il codice html che si intende mettere ...
</div>
</body>

</html>
 


Correlati

Leave a reply