Drag and Drop nur in eine Richtung

  • Hey,


    bin gerade dabei mich um ein Kartendesign zu kümmern.
    Dazu zählt, dass der User per Drag and Drop die Karte natürlich verschieben kann.


    Dazu gibt es folgende HTML Datei:


    Dabei ist das Element "map" der "Maincontainer" zum "halten" der Karte.
    InnerMap ist dabei die eigentliche Karte mit Image.


    Mein Problem ist nun, dass meine Map sich seltsamerweise nur in 2 Richtungen bewegt.
    Nur nach rechts und nach unten.
    Habe per console.log ein paar Ausgaben gemacht wohin die Karte eigentlich hinziehen müsste.


    Beispielsweise erhalte ich in der Konsole dann das Ergebniss "go to the left" 117x, eine Zeile unter der Ausgabe wird die innerMap sofort verschoben.
    Jedoch tut sich dort einfach nichts.


    Hier der JS Code dazu:



    Ist natürlich nicht alles aber die Methoden start, stop, init habe ich jetzt einfach mal weggelassen. Das funzt ja auch alles.
    Hoffe mir kann jemand sagen wo da mein Denkfehler liegt.
    Aber an sich bekomme ich die korrekten Ausgaben, wohin sich die Karte bewegen soll, jedochbewegt sie sich wie gesagt nru nach unten und nach rechts :/



    lg

  • Leider noch nie gehört :/
    Nein, arbeite derzeit über localhost und kann das auch nirgends hochladen.
    Muss man erstmal Zustimmung vom Admin holen und das dauert 2 Wochen :D


    Hab den htdocs Ordner mal angehängt.
    Kannst es dir dort anschauen ^^


    Hab mir das canvas Element mal schnell angeschaut, beschreibe die Seite aber nicht mit HTML5 :/
    Bin bei 4^^

  • Nimm einen Feehoster, davon gibt es etliche wenn du den Begriff in eine Suchmaschine eingibt. Ich werde bestimmt keine Datei herunterladen.


    Warum verwendest du veraltete Techniken, gibt es dafür einen speziellen Grund?
    Html5 ist mittlerweile Standard und das Canvas-Element wurde extra für solche Zwecke erfunden.


    - - - Aktualisiert - - -


    Ergänzung zu meinem vorherigen Beitrag:
    Du musst nicht mal alles selber erstellen, das haben schon andere gemacht und eine Auswahl findest du hier: http://www.canvasdemos.com/2009/02/23/world-map/


    DEMO unter http://concentriclivers.com/slippymap.html

  • Danke wasn Freehoster ist weiß ich auch. Systemadmin sagt dir aber auch was, oder?
    Geblockte Ports vill. auch, daher auch der Antrag und die Wartezeit. :)


    Ich habe hier keine Frage gestellt von wegen bitte gibt mir Demos.
    Danke nein. Warum HTML4 veraltet ist versteh ich auch nicht ganz.
    Ich denke nur weil du vielleicht damit umgehen kannst o.s. heißt es nicht das alles andere veraltet ist.
    Ich denke mal, dass ich mit dem was ich kann genug anfangen kann.


    Also es besteht immernoch das gleiche Problem, dass die Ausgabe (die man auch im Quellcode sieht) erscheint,
    jedoch wird die Zeile dadrunter nicht ausgeführt.


    Wäre nett wenn mir dabei geholfen wird und nicht nur gesagt wird das es veraltet ist und ich Demos benutzen soll.


    Ich werd mal schauen ob ich da durch die Quellcodes steige aber an und für sich für eine kleine Beispielkarte die ich gerade machen will,
    reicht das eigentlich auch wenn es gerade noch etwas rumbuggt.


    #edit: Sieht das da oben irgendwie aus wie eine riesige Weltkarte?
    Es soll eine kleine Übung sein um später mal eine stink normale Spielkarte zu erstellen.


    Dennoch wärs nett, wenn jemand Hilfe zu meinem gestellten Problem hat.

  • *räusper* (etwas offtopic)
    mal aus wikipedia, aber ich bin mir sicher, das wird auch woanders bestätigt werden.

    Zitat

    Laut dem Zeitplan des W3C soll HTML5 2014 offiziell verabschiedet, d. h. zu einer W3C Recommendation werden.


    nur weil etwas im last-call-status ist, heiss es nicht, dass aktuelle technologie bereits veraltet ist.
    und an newslettern sieht man zB auch dass html3 oder 4 noch ne daseinsberechtigung hat.


    fakt is, wenn der stift das mit nem bild lösen will/muss hat er dafür gründe und "veraltet ist html4 oder xhtml erst, wenns deprecated geschimpft wird und nicht mehr genutzt.

  • nicht last call, sonder candidate recommandation ist der Status:
    http://www.w3.org/TR/html5/
    Die englische Wikipedia ist da besser als Infomationsquelle: http://en.wikipedia.org/wiki/HTML5#Standardization_process


    Genaugenommen ist jedoch last stable Version html 4.01, jedoch empfiehlt das W3C Html5 ruhig schon zu verwenden und auf Fallbacklösungen für ältere Browser zurückzugreifen.


    Im Grunde hast du natürlich recht, das Html 4.01 aktuell ist und nicht als depraced eingestuft wurde.

  • Traurig!


    Es gibt ein Problem und es wird auf irgendwelchen Demos und Verweise von W3C geraten.
    Wenn ich mit JavaScript / HTML4 arbeite, habe ich wie synaptic schon sagte meine Gründe dafür.


    Davon mal abgesehen gibt es so viel Open Source Produkte die auch noch damit entwickelt werden.
    Also lasst mal euer Off-Topic sein, so ein Schwachsinn.
    Selbst wenn ich jetzt sage ich programmiere mit Assembler wäre das doch meine Sache oder würde da auch nur kommen ist zu alt?
    Es mal nett zu erwähnen, dass es neuere Techniken gibt, reicht komplett aus.
    Aber es ist unnötig sich darüber bei einer Problemstellung auszutauschen. Macht dafür dochn neues Forum auf...


    Konzentriert euch mal auf das gestellte Problem mit dem gleichen Engagement, wie herauszufinden ob irgendwas veraltet ist.
    Ansonsten spart euch eure Kommentare, danke.


    Wenn euch keine Lösung einfällt, ihr kein Willen habt in etwas anderem als dem Neustem zu helfen, dann geht doch einfach nicht in dieses Thread.
    Danke für eure Hilfe! ;)


  • Wenn ich mit JavaScript / HTML4 arbeite, habe ich wie synaptic schon sagte meine Gründe dafür.


    HTML 4.01 verwendet CSS 2.1 und das kennt kein background-size:cover, da es CSS3 ist.
    siehe => http://www.w3.org/TR/CSS2/colors.html


    Für eine Spielkarte ist Canvas das Mittel der Wahl und die Demo war ein Beispiel. Die dahinterliegende Karte hat mit der Funktionalität nur in sofern etwas zu tun als das es demonstrieren sollte, wie man etwas verschiebt, man hätte ebenso gut auch ein Bild mit festen Ausmaßen nehmen können.
    Schau mal wie lange Canvas schon unterstützt wird => http://caniuse.com/canvas


    Du kannst auch mit Tabellenlayout arbeiten, wirst damit aber immer mit Gegenwind rechnen müssen, da es nun mal nicht zu den besten Verfahren zählt.
    Wenn du Vorgaben hast, dann ist das in Ordnung. In Ordnung ist es aber nicht, wenn wir deine gestellten Aufgaben lösen, die du dann deinem Vorgesetzten als deine Lösung präsentierst.
    Denk also besser nochmal nach wie du das umsetzt und was daran eventuell falsch ist.
    Debuggen gehört schließlich zu den Grundaufgaben eines Programmierers(sofern man Javascript zu den Programmiersprachen dazu zählen mag).


    Ich gebe dir jetzt noch einen Tipp: Veschiebe das Hintergrundbild anstatt des Divs.

  • Für eine Spielkarte ist Canvas das Mittel der Wahl und die Demo war ein Beispiel. Die dahinterliegende Karte hat mit der Funktionalität nur in sofern etwas zu tun als das es demonstrieren sollte, wie man etwas verschiebt, man hätte ebenso gut auch ein Bild mit festen Ausmaßen nehmen können.
    Schau mal wie lange Canvas schon unterstützt wird => http://caniuse.com/canvas


    Tut mir leid, dass wenn ich mit ein paar JS-Zeilen eine kleine Karte machen will, nicht auf eine Demo mit Weltkarte und Zoom zurückgreife, sorry wa ^^


    Du kannst auch mit Tabellenlayout arbeiten, wirst damit aber immer mit Gegenwind rechnen müssen, da es nun mal nicht zu den besten Verfahren zählt.


    Wo steht hier was von Tabellenlayouts? Sehe nix^^


    Wenn du Vorgaben hast, dann ist das in Ordnung. In Ordnung ist es aber nicht, wenn wir deine gestellten Aufgaben lösen, die du dann deinem Vorgesetzten als deine Lösung präsentierst.


    Hab ich davon je was gesagt, dass ich diese Lösung jemanden präsentieren muss? Nein, es ist nämlich auch nicht so.
    Und wo wird das denn zu eurer Lösung, wenn ihr mir bei einem Problem helft, versteh ich nicht ganz.
    Logischer wäre es zu sagen, wenn ich mir die Demos ziehe o.a. dass es dann nicht mehr meine Lösung wäre,
    was du btw. die ganze Zeit versuchst und nicht verstehst, dass ich einfach eine klitze kleine 2D-Karte machen möchte zur Übung.


    Denk also besser nochmal nach wie du das umsetzt und was daran eventuell falsch ist.


    Nichts ist daran falsch, Techniken zu benutzen die immernoch im Einsatz sind und mit denen ich besser umgehen kann.-


    Debuggen gehört schließlich zu den Grundaufgaben eines Programmierers(sofern man Javascript zu den Programmiersprachen dazu zählen mag).


    Mein Problem hast du dir aber schon durchgelesen und verstanden, ne?
    Ich habe eine Debugausgabe die mir ausgegeben wird, jedoch die Zeile drunter wird nicht ausgeführt.
    Also der Tipp zum Debuggen ist hier definitv falsch.


    Ich gebe dir jetzt noch einen Tipp: Veschiebe das Hintergrundbild anstatt des Divs.


    Das ist doch was, mit dem man anfangen kann. Das hättest du im ersten Beitrag schreiben können aber nein du weißt alles besser
    und meinst hier irgendwen zu bevormunden was er benutzen soll o.a.
    Ich habe keine Vorgaben, ich habe nur mein Wissen wo ich SELBER weiß was ich besser kann und womit ich mich beschäftigen möchte, scheint für dich ja schwierig zu verstehen sein.


    Hoffe, dass ich damit jetzt deine seltsamen Dinge die du hier in den Raum stellst geklärt habe.
    Zumal es immer die Entscheidung des Programmiers ist was er benutzt und wie.
    Ein normaler Verweis auf eine neuere Technik reicht aus, aber nein du musst ja halb drauf zwingen, dass man es so macht.
    Das ist sinnlos und undproduktiv, also lass sowas doch einfach mal, sogar wenn es schon 2 oder 3x erwähnt wurde.