L'obtention de jQuery déplaçable d'accrochage spécifique de la grille

(REMARQUE: Certains ont posé des questions similaires, mais ont été trop spécifique et n'a donné aucun utilisable réponses)

jQuery UI est déplaçable widget a des options pour l'accrochage à la grille, mais pas moyen de définir ce que la grille est relatif.

Par exemple, nous avons clairement défini, 20x20 grille dans notre cible de dépôt. Un faites glisser l'élément qui commence à 0,0 à l'intérieur de la cible de dépôt va casser en correspondance avec la grille. Mais un faites glisser l'élément qui commence à un endroit différent, ou à l'extérieur de la cible, ne s'alignent pas avec cette grille.

L'obtention de jQuery déplaçable d'accrochage spécifique de la grille

http://jsfiddle.net/FNhFX/5/

HTML:

<div class="drop-target">
    <div class="drag-item">Drag me</div>
    <div class="drag-item" style="left:87px;top:87px;">Drag me</div>
</div>
<div class="outside-drag-item">Drag me</div>

JS:

$(function() {
    $(".drag-item").draggable({
        grid: [20, 20]
    });
    $(".outside-drag-item").draggable({
        grid: [20, 20],
        helper:"clone"
    });
    $(".drop-target").droppable({
        accept: ".drag-item"
    });
});

Est-il tout façon à se caler sur un quadrillage à l'aide de jQuery déplaçable?

Je pense que u besoin de mettre helper:"d'origine" pour l'extérieur-le glisser l'élément, bcaz option cloner cloner pour faire glisser et originale séjour même endroit.
qui ne fait pas de différence: jsfiddle.net/FNhFX/7
U sera élaborée plus à propos de "glisser-moi" div comportement, je pensais à l'extérieur, on n'est pas déplaçant à l'intérieur de la grille.

OriginalL'auteur Yarin | 2013-12-20

Leave a Reply

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *