Ovviamente, come nel mio stile, l'ho personalizzata un bel po' per cercare di possederne i princìpi anzichè copiarla pedissequamente.
Ecco il risultato personale, almeno per il momento:
<script src="funzioni.js"></script>
<script>
var offsetX;
var startX;
var startY;
var dragElement;
function inizializza(){
document.onmousedown=onMouseDown;
document.onmouseup=onMouseUp;
}
function onMouseDown(e){
dragElement=e.target
offsetX=ExtractNumber(dragElement.style.left);
offsetY=ExtractNumber(dragElement.style.top);
startX=e.clientX;
startY=e.clientY
document.onmousemove=onMouseMove;
return false;
}
function onMouseMove(e){
dragElement.style.left=offsetX+e.clientX-startX;
dragElement.style.top=offsetY+e.clientY-startY;
}
function onMouseUp(){
document.onmousemove=null;
}
inizializza();
</script>
<body>
<div id="cartello" style="background:red;width:200px;height:100px;position:absolute;left:100px;top:50px"></div>
<div id="ciccio" style="background:blue;width:200px;height:100px;position:absolute;left:100px;top:150px"></div>
</body>
Sembra che funzioni!
Salve, per puro piacere vorrei imparare anch'io drag&drop, è da un po che ci provo, speriamo di riuscire con i tuoi appunti, ciao :)
RispondiEliminaCavoli, questa è una cosa che ho fatto molto tempo fa, e al momento me la devo ripassare anch'io... :-D
RispondiEliminaCiao :-D
RispondiEliminaComunque la tecnica l'ho imparata da un tutorial in rete... non mi ricordo se ho riportato il link.
RispondiEliminaUna cosa su cui ho sudato letteralmente il sangue sono state le collisioni. Alla fine ci sono riuscito decentemente, ma non mi ricordo affatto il procedimento. Dovrei avere il file da qualche parte, prima o poi me lo ripasserò.
RispondiElimina