glisser hors du corps html/div/tout

Question

je fais une classe d'éléments draggable comme celui-ci

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

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

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

    } 
}); 

maintenant le problème est, je suis en mesure de faire glisser les éléments hors du corps, et tout le html. comment puis-je limiter la zone dans laquelle il est draggable?

Answer 1

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

contraint à glisser dans les limites de l'élément spécifié ou d'une région. Valeurs de chaîne possibles: 'parent', 'document', 'fenêtre', [x1, y1, x2, y2].

Exemple:

initialiser un glissable avec l'option de confinement spécifiée.

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

Ou au cas où le problème est que le draggable peut être placé dans tous les sens:

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

Si la valeur true, l'élément retournera à sa position de départ lors du déplacement arrête Valeurs de chaîne possibles: 'valide', 'invalide'. Si la valeur est invalid, le retour ne se produira que si le draggable n'a pas été déposé sur une droppable. Pour valide, c'est l'inverse.

Et enfin, je ne vous vois pas régler la portée de la draggable (Modifier: Mais cela ne fixerai pas votre problème, les 2 autres choses devraient ci-dessus):

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

Utilisé pour regrouper des ensembles d'éléments draggables et de blocs de dépôt, en plus de l'option d'acceptation droppable. Un draggable ayant la même valeur de portée qu'une droppable sera accepté par la droppable.

Exemple:

initialiser un glissable avec l'option d'étendue spécifiée.

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