Ist es möglich, den Überlauf für einen jQuery UI Sortable helper zu kontrollieren?

Question

Ich habe Markup, das in etwa wie folgt aussieht:

<div class='root'> 
    <div class='wrapper'> 
     <div class='column'> 
      ... 
     </div> 
     ... 
    </div> 
</div> 

Die Wurzel div hat overflow: auto und Breite/Höhe, die sich ändern können. Die Spalten haben feste Breiten und sind links schwebend. Der Wrapper hat eine feste Breite, die der Summe der Spaltenbreiten entspricht. Das Endergebnis ist eine Gruppe horizontal angeordneter Spalten innerhalb einer Ansicht, die Bildlaufleisten anzeigt, wenn die Spaltenhöhe oder die gesamte Spaltenbreite ihre Grenzen überschreitet.

Ich habe eine jQuery UI sortierbar auf das Wrapper Div angewendet, so dass die Spalten innerhalb sortiert werden können. Das funktioniert gut, bis auf ein Problem: sortierbar gibt das Element sortiert position: absolute, die es scheinbar aus dem normalen Layout entfernt. Wenn die Spalte also sehr groß ist, erhält die gesamte Seite eine Bildlaufleiste, bis das Element wieder in Position gebracht wird.

Gibt es eine Möglichkeit, dass der sortierbare Helfer auch während des Sortierens im Scroll-Div enthalten bleibt?

Answer 1

Ich denke, das könnte für Sie arbeiten.

Sie können wählen, wo Ihr sortierbar Helfer mit folgendem anhängen:

$(".selector").sortable({ appendTo: 'div.wrapper' }); 

Aus der Dokumentation:

„appendTo: Legt fest, wo die Helfer, die mit der Maus bewegt sich während der angefügt wird Ziehen (z. B. zum Lösen von Überlappungs-/zIndex-Problemen). "