jQuery Hauteur article triables

Question

J'ai simple jQuery triables basée sur une liste comme suit:

<ul> 
    <li>Item 1</li> 
    <li>Item 2</li> 
    <li>Item 3</li> 
    <li>Item 4</li> 
</ul> 

J'ai créé une fonction d'assistance de sorte que, peu importe ce qui peut être le contenu d'un élément, la l'assistant est toujours la même taille fixe. Mon problème est que si je fais glisser un objet qui a beaucoup de contenu (dit plusieurs paragraphes de texte), même si mon assistant n'a qu'une seule ligne de hauteur, l'élément ne tombera pas sur l'élément ci-dessous jusqu'à ce qu'il a voyagé au moins la hauteur originale de mon article.

Par exemple:

<ul> 
    <li>Item 1 
    line2 
    line3 
    line4 
    line5 
    </li> 
    <li>Item 2</li> 
    <li>Item 3</li> 
    <li>Item 4</li> 
</ul> 

Si je fais glisser Item1 mon aide se transforme cela en une seule ligne - agréable et facile à glisser. Cependant, j'ai encore besoin de déplacer la souris 5 lignes en bas de l'écran avant que item1 puisse être déposé entre item2 et item3. Une fois que je fais glisser la hauteur suffisante, l'objet semble alors fonctionner comme je le pensais, et je n'ai plus besoin de le faire glisser à la hauteur d'origine.

J'ai essayé toutes les options triables que je peux penser mais en vain et j'espère que quelqu'un a une suggestion.

$('#sortable').sortable({ 
    placeholder: 'highlight', 
    axis: 'y', 
    helper: function(event) { 
    return $(this).find('.drag').clone(); 
}, 
}); 

Answer 1

Vous pouvez saisir la hauteur actuelle de la division traîné, l'enregistrer dans une variable et assigner une hauteur générique à la DIV traîné. Une fois qu'il est placé, utilisez le rappel pour réaffecter la hauteur dans la variable.

var curHeight = $(div).height(); 

$(div).css({height: 20px;}); 

Vous pouvez également envisager forceHelperSize

Answer 2

Après beaucoup de cheveux indéchirable j'ai ajouté cet événement au sortable:

start: function(event, ui) { 
    $(this).sortable('refreshPositions') 
    }, 

Il semble faire l'affaire que je pense commencer() est appelé après que l'assistant a été créé, de sorte que le rafraîchissement des positions réinitialise la hauteur. Probablement jQuery devrait le faire lui-même, mais pour l'instant je suis heureux.

Answer 3

Ce qui suit a fonctionné pour moi:

stop: function(event,ui){ 
    ui.item.height("auto"); 
}