Yoho,
ich habe eine Karte, die aus...vielen Divs zusammengestellt ist. Im ungewöhnlichsten Fall (alle 3 Ebenen haben auf jedem Feld ein Tile) sind das bei einer Größe von 20x20 Feldern (was nicht immer der Fall ist sondern nur als Beispiel dienen soll) 1.200 Divs die alle so diese Form haben:
Alle zusammengepackt in einem Überdiv mit dem sprechenden Namen (na wer kommt drauf?) "mapDiv" XD siehste keiner wusste es... ok weiter.
Das Bewegen per JS geht, da Yui bei mir eh schon eingebunden ist benutze ich die dort zu findende Animationsfunktionalität. Der Haken ist das es super lahm und zuckelig ist.
Hat jemand eine Idee wie man das geschmeidiger lösen kann?
Have fun
Zuckel-Animation
gepostet vor 17 Jahre, 2 Monate von Macavity
gepostet vor 17 Jahre, 2 Monate von raufaser
Ich weiß jetzt nicht, ob du das div mapDiv bewegst, oder alle divs darin. Wenn du alle Divs darin bewegst, ist es natürlich ziemlich langsam, aber dann gäbe es vielleicht noch folgende Möglichkeit:
Du könntest den Container-Layer (mapDiv) als position:absolute definieren und noch einen Layer drüber legen, für den du den Anzeigebereich mit clip definierst. Dann bewegst du einfach den mapDiv und die Elemente darin (position:relative) sollten vom Browser automatisch mit positioniert werden. Durch das Clip sieht der User dann aber nur den richtigen Ausschnitt...
Zumindest theoretisch...
Aber wie gesagt: Ich weiß nicht, wie du es jetzt derzeit machst, also sorry, wenn mein Post das Thema doch verfehlen sollte...
Gruß,
Marc
Du könntest den Container-Layer (mapDiv) als position:absolute definieren und noch einen Layer drüber legen, für den du den Anzeigebereich mit clip definierst. Dann bewegst du einfach den mapDiv und die Elemente darin (position:relative) sollten vom Browser automatisch mit positioniert werden. Durch das Clip sieht der User dann aber nur den richtigen Ausschnitt...
Zumindest theoretisch...
Aber wie gesagt: Ich weiß nicht, wie du es jetzt derzeit machst, also sorry, wenn mein Post das Thema doch verfehlen sollte...
Gruß,
Marc
gepostet vor 17 Jahre, 2 Monate von Macavity
Hm leider ja, etwas in der Art mache ich bereits.
Natürlich wird das Rahmen-Div bewegt und nicht jedes einzelne Div, das wäre ja auch selten dämlich XD
Die kleinen Divs sind wie du vorgeschlagen hast bereits per relative zu dem Rahmen-div positioniert und der Anzeigebereich soll nicht das Problem sein. Werde das ganze letztlich per iframe darstellen.
Natürlich wird das Rahmen-Div bewegt und nicht jedes einzelne Div, das wäre ja auch selten dämlich XD
Die kleinen Divs sind wie du vorgeschlagen hast bereits per relative zu dem Rahmen-div positioniert und der Anzeigebereich soll nicht das Problem sein. Werde das ganze letztlich per iframe darstellen.
gepostet vor 17 Jahre, 2 Monate von raufaser
Etwas, was du mal ausprobieren könntest, wäre statt dem Layer ein "left:Npx;top:Npx" zuzuweisen für's scrollen, es mit "padding-left" und "padding-top" zu versuchen und dann jeweils mit positiven und negativen Werten zu arbeiten. Vielleicht wird es mit padding schneller gerendert, als bei der Neupositionierung des Layers.
Sonst fällt mir jetzt adhoc auch nichts ein...
Gruß,
Marc
Sonst fällt mir jetzt adhoc auch nichts ein...
Gruß,
Marc
gepostet vor 17 Jahre, 2 Monate von Macavity
Ja das wäre zumindest denkbar, werde mal testen.
Spontan kam mir die Frage ob es einen Unterschied macht die Bilder per CSS background image einzubinden als über IMG-Tag. Weiß das vielleicht jemand?
Eine weitere Möglichkeit wäre natürlich die Ebenen zu jeweil einem großen teilweise transparenten PNG zusammen zu kleben, aber ob das einen gute Idee ist?
Spontan kam mir die Frage ob es einen Unterschied macht die Bilder per CSS background image einzubinden als über IMG-Tag. Weiß das vielleicht jemand?
Eine weitere Möglichkeit wäre natürlich die Ebenen zu jeweil einem großen teilweise transparenten PNG zusammen zu kleben, aber ob das einen gute Idee ist?
gepostet vor 17 Jahre, 2 Monate von Drezil
ich verstehe nicht, wieso du für jedes img ein div anlegst.
Ich habe die imgs bei mir direkt absolute positioniert und verschiebe diese auch alle nacheinander ohne ruckeln (drag&drop der karte).
Ich weiss nicht, wie genau deine Umgebung aussieht, aber man kann sich ja mal im IRC unterhalten (und so auch leicht passende beispiele zeigen).
ps:
es macht meist einen ziemlichen unterschied die Bilder oder die ganze map per display:none auszublenden, dann zu bewegen und dann per display:block wieder einzublenden.
Für den Browser wird es imho kein Unterschied machen, ob du den Container oder die Bilder selbst bewegst, da die Renderposition der Bilder abhängig vom Container ist - und diese imho beim rendern erst on-the-fly ermittelt wird.
Ich habe die imgs bei mir direkt absolute positioniert und verschiebe diese auch alle nacheinander ohne ruckeln (drag&drop der karte).
Ich weiss nicht, wie genau deine Umgebung aussieht, aber man kann sich ja mal im IRC unterhalten (und so auch leicht passende beispiele zeigen).
ps:
es macht meist einen ziemlichen unterschied die Bilder oder die ganze map per display:none auszublenden, dann zu bewegen und dann per display:block wieder einzublenden.
Für den Browser wird es imho kein Unterschied machen, ob du den Container oder die Bilder selbst bewegst, da die Renderposition der Bilder abhängig vom Container ist - und diese imho beim rendern erst on-the-fly ermittelt wird.
gepostet vor 17 Jahre, 2 Monate von Nuky
Ich würde die Bilder sowieso vom Server vorgenerieren lassen in größere Bilder, und diese dann bewegen. Ansonsten ev. nicht YUI benutzen - kA wie effizient die dabei ist..?
Sonst: Timeout runterstellen..? Kann auch helfen. Gewisse Timeouts *kann* der Browser garnicht (Timeout von 10 wird simuliert, falls der Browser z.B. 100 als Minimum hat macht er einfach jeden Poll 10 Stück vom Timeout..)
Sonst: Timeout runterstellen..? Kann auch helfen. Gewisse Timeouts *kann* der Browser garnicht (Timeout von 10 wird simuliert, falls der Browser z.B. 100 als Minimum hat macht er einfach jeden Poll 10 Stück vom Timeout..)