PSD-Tutorials.de
Forum für Design, Fotografie & Bildbearbeitung
Tutkit
Agentur
Hilfe
Kontakt
Start
Forum
Aktuelles
Besonderer Inhalt
Foren durchsuchen
Tutorials
News
Anmelden
Kostenlos registrieren
Aktuelles
Suche
Suche
Nur Titel durchsuchen
Von:
Menü
Anmelden
Kostenlos registrieren
App installieren
Installieren
JavaScript ist deaktiviert. Für eine bessere Darstellung aktiviere bitte JavaScript in deinem Browser, bevor du fortfährst.
Du verwendest einen veralteten Browser. Es ist möglich, dass diese oder andere Websites nicht korrekt angezeigt werden.
Du solltest ein Upgrade durchführen oder einen
alternativen Browser
verwenden.
Antworten auf deine Fragen:
Neues Thema erstellen
Start
Forum
Sonstiges
Webdesign, Webentwicklung & Programmierung
PHP, Javascript, jQuery, Ajax, nodeJS, MySQL...
HTML5 Drag + Drop
Beitrag
<blockquote data-quote="Duddle" data-source="post: 2533385" data-attributes="member: 17775"><p>Du hast ist ein sehr gutes Beispiel für</p><p></p><p>konstruiert, obwohl es noch nichtmal eine "Lösung" ist. Zum Beispiel: welchen Zweck hat die Skalieren-Funktion? Die ist für mich vollkommen überflüssig, präsentiert dafür aber mehr Möglichkeiten für Fehler und hat sicher wenigstens eine Stunde verschlungen.</p><p></p><p>Auch nutzt du vorhandene Werkzeuge und Bibliotheken nicht aus. Beispielsweise musst du <em>this.getElementsByClassName</em> nicht selbst definieren, wenn du jQuery hast. Du hast auch sehr viel Code für das Drag&Drop drin, der sicher problemlos von jQuerys Draggable ersetzt werden kann. Zum Setzen der Cookies (auch wenn das nur für Testzwecke ist) reicht es, ein <a href="https://github.com/js-cookie/js-cookie" target="_blank">kleines PlugIn/Script</a> einzubinden, um viel der Komplexität zu verstecken.</p><p></p><p>Je weniger Code du selber schreibst (und den Rest von guten, getesteten, durchdachten PlugIns übernehmen lässt), desto einfacher ist es ihn zu verstehen und zu debuggen. Ich weiß auch nicht, wie du debuggst. Benutzt du (bzw. ein äquivalent für deinen Browser)? Dann würdest du sehen, dass auf schon jQuery nicht richtig eingebunden wird, ohne das nix funktioniert.</p><p></p><p>Falls du das ganze als Übungsaufgabe zum Lernen von JS siehst, solltest du trotzdem erstmal ein Feature komplett entwickeln, bevor du zum nächsten gehst. Zum Beispiel:</p><p></p><p>Das brauchst du nicht, solange die Grundfunktionalität nicht besteht. Auch zweifle ich daran, dass du unbedingt JS dafür benötigst. Wenn du ein anderes Bild beim Drüber-Hovern anzeigen willst, bietet sich :hover von CSS an.</p><p></p><p></p><p>Dann war die Box kein Bild wie die Kerze jetzt. Hast du den Code noch irgendwo da?</p><p></p><p>Ich möchte nochmal unterstreichen, dass eine einfache, funktionierende Lösung üblicherweise besser ist als ein komplexer, nicht-so-richtig-funktionierender Ansatz.</p><p>Für dein Problem wäre mein Vorgehen wie folgt: Nutzer Drag&Dropt die Kerze (implementiert in 5 Zeilen mit jQuery Draggable), das "Drop" davon löst den Speichervorgang aus (POST an ein serverseitiges Script auslösen, das sind vielleicht 2 Zeilen in jQuery) und einen Seitenreload (1 Zeile). Beim Seitenaufbau generiert der Server anhand der gespeicherten Positionen das entsprechende HTML und die Sache ist fertig. Die schwierigste Sache hierbei ist das PHP-Script, der größte Knackpunkt das Umgehen mit unerwünschten Kerzenpositionen. Die ganzen Extra-Gimmicks können <em>danach</em> integriert werden.</p><p></p><p></p><p>Duddle</p></blockquote><p></p>
[QUOTE="Duddle, post: 2533385, member: 17775"] Du hast ist ein sehr gutes Beispiel für konstruiert, obwohl es noch nichtmal eine "Lösung" ist. Zum Beispiel: welchen Zweck hat die Skalieren-Funktion? Die ist für mich vollkommen überflüssig, präsentiert dafür aber mehr Möglichkeiten für Fehler und hat sicher wenigstens eine Stunde verschlungen. Auch nutzt du vorhandene Werkzeuge und Bibliotheken nicht aus. Beispielsweise musst du [I]this.getElementsByClassName[/I] nicht selbst definieren, wenn du jQuery hast. Du hast auch sehr viel Code für das Drag&Drop drin, der sicher problemlos von jQuerys Draggable ersetzt werden kann. Zum Setzen der Cookies (auch wenn das nur für Testzwecke ist) reicht es, ein [URL='https://github.com/js-cookie/js-cookie']kleines PlugIn/Script[/URL] einzubinden, um viel der Komplexität zu verstecken. Je weniger Code du selber schreibst (und den Rest von guten, getesteten, durchdachten PlugIns übernehmen lässt), desto einfacher ist es ihn zu verstehen und zu debuggen. Ich weiß auch nicht, wie du debuggst. Benutzt du (bzw. ein äquivalent für deinen Browser)? Dann würdest du sehen, dass auf schon jQuery nicht richtig eingebunden wird, ohne das nix funktioniert. Falls du das ganze als Übungsaufgabe zum Lernen von JS siehst, solltest du trotzdem erstmal ein Feature komplett entwickeln, bevor du zum nächsten gehst. Zum Beispiel: Das brauchst du nicht, solange die Grundfunktionalität nicht besteht. Auch zweifle ich daran, dass du unbedingt JS dafür benötigst. Wenn du ein anderes Bild beim Drüber-Hovern anzeigen willst, bietet sich :hover von CSS an. Dann war die Box kein Bild wie die Kerze jetzt. Hast du den Code noch irgendwo da? Ich möchte nochmal unterstreichen, dass eine einfache, funktionierende Lösung üblicherweise besser ist als ein komplexer, nicht-so-richtig-funktionierender Ansatz. Für dein Problem wäre mein Vorgehen wie folgt: Nutzer Drag&Dropt die Kerze (implementiert in 5 Zeilen mit jQuery Draggable), das "Drop" davon löst den Speichervorgang aus (POST an ein serverseitiges Script auslösen, das sind vielleicht 2 Zeilen in jQuery) und einen Seitenreload (1 Zeile). Beim Seitenaufbau generiert der Server anhand der gespeicherten Positionen das entsprechende HTML und die Sache ist fertig. Die schwierigste Sache hierbei ist das PHP-Script, der größte Knackpunkt das Umgehen mit unerwünschten Kerzenpositionen. Die ganzen Extra-Gimmicks können [I]danach[/I] integriert werden. Duddle [/QUOTE]
Bilder bitte
hier hochladen
und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Zitate einfügen…
Authentifizierung
Wenn ▲ = 7, ▼ = 3, ◇ = 2 und die Summe von ▲ und ▼ durch ◇ geteilt wird, was ist das Ergebnis?
Antworten
Start
Forum
Sonstiges
Webdesign, Webentwicklung & Programmierung
PHP, Javascript, jQuery, Ajax, nodeJS, MySQL...
HTML5 Drag + Drop
Oben