jQuery - Drag & Drop plus fester Platz

[Gunther]

Hi!

Du könntest schauen, ob sich das mit der Option revert bei Draggable hinbekommen lässt - "If set to true, the element will return to its start position when dragging stops."
Damit könntest du das Bild an seine ursprüngliche Position "zurückkehren" lassen - und dann seine Quelle gegen ein Blind-GIF o.ä. austauschen. In den Container fügst du dann ein neues Bildobjekt ein, dem du die Adresse des gerade ge-drag-ten gibst. Die Referenz auf das ursprüngliche Bildobjekt könntest du als zusätzliche Eigenschaft am neuen Bildobjekt ablegen - so kannst du den Quellentausch wieder rückgängig machen, um das Bild per Doppelklick wieder an seiner ursprünglichen Position anzeigen zu lassen. (Das dann nicht mehr benötigte Bildobjekt aus dem Container wäre dann noch wieder zu entfernen.)

Rückmeldung, bzw. Rückfragen folgen ...

Hier mal eine erste Rückmeldung:
Also nachdem ich mich jetzt etwas ausführlicher mit jQuery UI beschäftigt habe, muss ich erstmal feststellen, dass das zwar in vielen Dingen sehr praktisch ist, weil es die Implementierung diverser Funktionalitäten mit nur wenigen Codezeilen erlaubt, aber ...

Das größte "Aber" ist wohl, dass das Markup auch dementsprechend gestaltet sein muss, was aber wohl nicht immer möglich ist. Auch hatte ich ja bereits festgestellt, dass die meisten der Funktionen nicht mit einer Darstellung per display:table(-...) funktionieren.

Das schränkt die Verwendung in der Praxis dann doch ziemlich ein, wie ich finde.

Auch bei meinem konkreten Fall konnte ich das Markup nicht so gestalten, wie es für die Drag & Drop Funktion notwendig gewesen wäre. Ich habe mir deshalb nun damit beholfen, dass ich ein Thumbnail per Doppelklick in den Container für die neue Galerie "klone" und das ursprüngliche Thumbnail per display:none ausblende. Bei einem Doppelklick auf das Thumbnail im Galerie-Container wird dieses aus dem DOM entfernt und das ursprüngliche Thumbnail wieder auf display:block gesetzt.

Im Galerie-Container sind die einzelnen Thumbnails "sortable", also sortierbar. Die Reihenfolge wird nach jeder Sortierung jeweils in ein hidden Input-Feld geschrieben, welches beim Klick auf einen Absende-Button übertragen wird.

Nicht zu 100% meine favorisierte Lösung, aber für den Anfang ganz brauchbar. Vielleicht fallen mir ja noch ein paar Verbesserungsmöglichkeiten ein (, die ich auch umgesetzt kriege).

Gruß Gunther