Ergebnis 1 bis 6 von 6

Thema: HTML5 Drag + Drop

  1. #1
    HTML Newbie
    Registriert seit
    27.07.2015
    Beiträge
    6
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard HTML5 Drag + Drop

    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
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Teeny
    Registriert seit
    30.07.2015
    Beiträge
    20
    Danke
    2
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: HTML5 Drag + Drop

    bin auch kein voll profi aber kann eventuell einen anstoß geben in welche richtung du weitersuchen/probieren kannst.

    zu 1. Das Problem ist dass dein Script jeweils lokal im Browser läuft, du musst also deine kette auf deinem server speichern und im script eine art automerge (kein reines kopieren falls mehrere gleichzeitig die kette verlängern) einbauen, oder das script so schreiben das mit jedem lokalen hinzufügen auch auf der externen eine kerze hinzuefügt wird, dadurch sieht jeder neue besucher auch den beim aufruf aktuellsten stand der kette.


    zu 2. fällt mir jetzt nicht 100% nen ansatz ein aber könnte mir vorstellen das es mit einem iframe klappen könnte oder das du deinem div mit der Kette ne id vergibst und das script dann nur auf das div mit dieser id zugreifen kann.

    alle angaben ohne gewähr aber ich hoffe ich konnte etwas weiterhelfen oder zumindest anstoßen.

  3. #3
    HTML Newbie
    Themenstarter

    Registriert seit
    27.07.2015
    Beiträge
    6
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: HTML5 Drag + Drop

    Hallo Surenamba,

    vielen Dank für Deine Tipps.

    Zu 1) Genau, es muß global auf meinem Server gespeichert werden, so daß für jeden Besucher immer der aktuelle Stand ersichtlich ist. Aber jetzt wird noch nicht mal lokal gespeichert. Sobald ich die Seite schließe, ist alles weg.

    Zu 2) Ich denke, daß man es mit containment id gelöst bekommt. Aber wie ich das umsetzen soll, da bin ich momentan überfragt. Hab schon jede Menge gelesen und gegoogelt, aber wirklich weitergebracht hat es mich nicht.

    Ich denke, hier gibt es bestimmt einige fähige Köpfe, aber offensichtlich sind die auch damit überfordert. Wie soll ich als Newbie das dann schaffen?

    Vielleicht hilft es ja, wenn jemand meine Testseite anschaut http://dogs24.xobor.de/page-645566-5.html

    Der html-code sieht so aus

    <div id="verschieben"><img src="http://www.4-wände.de/hpfixseparat_blumenkerze.gif"></div>

    Und hier die Seite, auf der das Ganze später umgesetzt werden soll http://dogs24.xobor.de/page-645566-4.html

    Vielen Dank für Deine Hilfe und Grüße aus dem Tal der Ahnungslosen

    Schippo
    Geändert von Schippo (02.08.2015 um 22:42 Uhr)

  4. #4
    Teeny
    Registriert seit
    30.07.2015
    Beiträge
    20
    Danke
    2
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: HTML5 Drag + Drop

    zu 1:

    liegt deine komplette seite auf nem remoteserver oder startest du lokal von deinem rechner die seite im browser? Macht nämlich bei vielen java sachen grade bezüglich datenaustausch nen entscheidenden unterschied. bzw muss auf dem server ebenfalls die passende/aktuellste java version installiert sein

  5. #5
    HTML Newbie
    Registriert seit
    05.08.2015
    Beiträge
    7
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: HTML5 Drag + Drop

    Wo hast du da den überhaupt ein Drag and Drop verbaut? ICh kann da noch nix sehen.
    ICh würde da ganz erlich mit php cookies und java zsm arbeiten das ist für mich die beste lösung über das java lässt du die einzelnen öffnen und schließen und per klick wird automatisch per ajax die spalte gespeichert die als letztes offen ist mit hilfe der cookies die im Browser ja gespeichert werden.

  6. #6
    HTML Newbie
    Themenstarter

    Registriert seit
    27.07.2015
    Beiträge
    6
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: HTML5 Drag + Drop

    Hallo Surenamba,

    also ich starte die Seite im Browser. Habe das Forum mit fertigem Template und allen Funktionen vor 2 Monaten gemietet. Dann nur noch entsprechend angepaßt und bin nun dabei, es mit Inhalten zu füllen.

    Bin zwischenzeitlich zwar ein ganzes Stück weitergekommen, aber der Wurm ist immer noch irgendwo drin. Bin halt ein Newbie. Ich habe das jetzt einem Profi übergeben, denn gerade das Speichern ist doch recht kompliziert und überfordert mich total. Hier muß sehr viel berücksichtigt werden. Was passiert, wenn mehrere Nutzer gleichzeitig auf dieselbe Position wollen, wie oft darf der Nutzer die Position ändern, Zugriffe von Admin müssen uneingeschränkt sein, usw. usf. Alles Dinge, die man im Vorfeld gar nicht berücksichtigt.

    Trotzdem vielen Dank, daß Du verschiedene Denkanstöße gegeben hast.

    Viele Grüße

    Schippo

    - - - Aktualisiert - - -

    Hallo WebHolz,

    hab's gerade gesehen - habe die Anweisungen im Bodybereich gar nicht mitgesendet. Zwischenzeitlich sieht das Script etwas anders aus, denn ich bin hier ein ganzes Stück weitergekommen. Aber nicht weit genug, deshalb habe ich es jetzt einem Profi übergeben, der die Sache zu Ende bringt. Mit dem Speichern war ich überfordert, alles andere funktionierte recht gut bis auf onmouseover - onmouseout. Aber das wäre das kleinste Übel gewesen.

    Wie sagt man so schön: "Schuster bleib bei Deinen Leisten." Jetzt kümmere ich mich wieder um das, was ich kann - nämlich Häuser bauen. Aber genau genommen ist ja eine Website auch ein Haus - nur ein Virtuelles eben.

    Danke für Dein Interesse und die Hinweise.

    Viele Grüße

    Schippo

Ähnliche Themen

  1. Drag and Drop Schwierigkeiten
    Von hysterie im Forum HTML & CSS Forum
    Antworten: 0
    Letzter Beitrag: 26.11.2012, 21:06
  2. Javascript Drag and Drop
    Von Nyoko im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 5
    Letzter Beitrag: 08.05.2012, 13:16
  3. msn - bilderversand per drag n drop
    Von Andy im Forum Computer - Internet Forum
    Antworten: 6
    Letzter Beitrag: 24.12.2009, 00:43
  4. 3D Rotation per Drag and Drop
    Von Stylefreak im Forum Flash Forum
    Antworten: 0
    Letzter Beitrag: 26.10.2006, 13:26
  5. drag and drop
    Von BuntesAllerlei im Forum HTML & CSS Forum
    Antworten: 2
    Letzter Beitrag: 24.10.2004, 13:45

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •