-
[JQuery]Drag & Drop
Ciao a tutti.
Leggendo varie guide e spezzoni di codice stavo tentando di implementare una funzione drag&drop utilizzando JQuery.
Il problema è che provando lo stesso spezzone di codice su http://jsfiddle.net questo funziona mentre sul mio sito no.
Sinceramente non so esattamente quale sia il problema e spero possiate aiutarmi.
Codice HTML:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.min.js"></script>
All'interno del <head> il mio script:
Codice:
$(".draggable").draggable({ cursor: "crosshair", revert: "invalid"});
$("#drop").droppable({ accept: ".draggable",
drop: function(event, ui) {
console.log("drop");
$(this).removeClass("border").removeClass("over");
var dropped = ui.draggable;
var droppedOn = $(this);
$(dropped).detach().css({top: 0,left: 0}).appendTo(droppedOn);
},
over: function(event, elem) {
$(this).addClass("over");
console.log("over");
}
,
out: function(event, elem) {
$(this).removeClass("over");
}
});
Codice HTML:
<div id="box" class="draggable">
<div class="header-box">
<strong>ID #111 <span style="float: right">mattia.rapisarda</span></strong>
</div>
<hr/>
<div class="content-box">
<span>aisfhids sidjfsifj sduofj sioa</span>
</div>
</div>
<div id="drop"></div>
-
Chi si rivede!
Ingloba tutto il js tra:
Codice:
$(function() {
...
});
Altrimenti quando js va a modificare gli attributi, gli elementi html ancora non esistono nemmeno!
Ciao!
-
Ciao Ale :D
Ogni tanto ritorno!
Comunque si, mi sfuggono sempre piccoli particolari irrilevanti direi..
Grazie mille, come sempre gentilissimo!
