Hallo @All,
ich benötige dringend Hilfe bei den vielen Optionen mit "Draggable". Bin noch ein absoluter Newbie und mit der Umsetzung total überfordert. Hätte mir mein Vorhaben nicht so schwierig vorgestellt Ich möchte auf meiner Website ein Hilfsprojekt für mißhandelte Tiere erstellen. Eine Solidaraktion soll das Bilden einer Lichterkette werden. Hierzu befindet sich bereits eine animierte Kerze (Mutterobjekt) an einer fest positionierten Stelle der Seite. Von dieser Kerze werden jetzt beliebig viele Duplikate erzeugt und per Drag+Drop zu einer Lichterkette formiert. Die Mutterkerze bleibt dabei immer an ihrem Platz. Das habe ich soweit auch schon hinbekommen und mein Script im Head-Bereich schaut so aus:
<script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script>
(function() {
'use strict';
$(document).ready(function()
{
$("#verschieben").draggable({
helper: "clone",
cursor: "move",
opacity: 0.7,
scroll: false
});
$("#verschieben").bind('dragstop', function(event, ui) { $(this).after($(ui.helper).clone().draggable());});
});
})();
</script>
Was mir nun große Schwierigkeiten bereitet sind die Koordinaten.
1. Das globale Speichern der gebildeten Kette. Die Kerzen lassen sich zwar jetzt x-beliebig aneinanderreihen, aber bei Verlassen der Seite und erneutem Aufruf ist die Lichterkette nicht mehr vorhanden, sondern nur noch die Mutterkerze. Es soll eine Solidaraktion werden - Die Besucher sehen Videos von mißhandelten Tieren, können hierzu einen Kommentar abgeben und als Solidaraktion eine Kerze anzünden und damit eine Lichterkette bilden. Es soll nur eine Lichterkette gebildet werden, also eine Gemeinschaftskette, jeder soll sich daran beteiligen können, indem er eine Kerze nimmt und an die Kette reiht, wenn er möchte auch immer wieder. Das Ergebnis soll immer wieder gespeichert werden und die Besucher sollen so die Kette wachsen sehen. Ich hoffe, daß ich es verständlich ausdrücken konnte.
Der 2. Punkt wäre das Verschieben über einen bestimmten Bereich der Seite hinaus. Jetzt kann man die Kerzen überall positionieren, selbst außerhalb der Seite. Die Seite ist jedoch gerahmt (eine Art Container). Auch innerhalb der Seite sollte schon ein definierter Bereich xy festgelegt werden, über den hinaus nichts positioniert werden kann, denn hierauf befinden sich u. a. eine Kommentarfunktion, Video usw. die natürlich nicht überlagert werden dürfen.
Mein Problem ist, daß ich hierüber kaum etwas Brauchbares im Internet in deutsch finden kann. Da es sehr kompliziert zu sein scheint, reichen meine Englischkettnisse nicht aus, um das Ganze auch noch zu verstehen, besonders die Zeichensetzung. Übersetzungen sind der reinste Kauderwelsch und selbst bei jQuery ist alles nur auf englisch und ohne Übersetzungsfunktion.
Kann mir jemand bei der Umsetzung behilflich sein? Ich wäre Euch sehr dankbar. Es ist mein erstes Projekt.
Viele Grüße
Schippo