trascinando fuori da html body / div / everything

Question

Rendo trascinabile una classe di elementi come questa

jQuery(".drag").draggable();

jQuery(".drop").droppable({
accept: ".drag",

drop: function(ev, ui) {
//do stuff with dropped data

    }
});

ora il problema è che sono in grado di trascinare gli elementi fuori dal corpo e in tutto l'html. come posso limitare l'area in cui è trascinabile?

Answer 1

http://docs.jquery.com/UI/Draggable#option-containment

Vincola il trascinamento all'interno dei limiti dell'elemento o della regione specificati. Possibili valori di stringa: 'parent', 'document', 'window', [x1, y1, x2, y2].

Esempio:

Inizializza un trascinabile con l'opzione di contenimento specificata.

$('.selector').draggable({ containment: 'parent' });

O nel caso in cui il problema sia che il trascinabile può essere posizionato ovunque:

http://docs.jquery.com/UI/Draggable#option-revert

Se impostato su true, l'elemento tornerà alla sua posizione iniziale quando il trascinamento si interrompe. Possibili valori di stringa: 'valido', 'non valido'. Se impostato su non valido, il ripristino si verificherà solo se il trascinabile non è stato lasciato cadere su un trascinabile. Per valido, è il contrario.

E infine, non ti vedo impostare l'ambito del trascinabile ( Modifica : ma questo non risolverà il tuo problema, l'altro 2 le cose sopra dovrebbero) :

http://docs.jquery.com/UI/Draggable#option-scope

Utilizzato per raggruppare set di oggetti trascinabili e trascinabili, oltre all'opzione di accettazione di droppable. Un trascinabile con lo stesso valore di ambito di un droppable sarà accettato dal droppable.

Esempio:

Inizializza un trascinabile con l'opzione scope specificata.

$('.selector').draggable({ scope: 'tasks' });