Es scheint, dass beide das Element aus seiner aktuellen Position bewegen können. Sind diese beiden Methoden austauschbar?Was ist der Unterschied zwischen der CSS3-Übersetzungsmethode und der relativen Positionierung von CSS2?
Antwort
Die beiden Methoden sind nicht genau das gleiche: ein Element Übersetzen erfordert nicht seine top
, left
, Eigenschaften right
oder bottom
CSS zu ändern, so dass auf die gleiche Art und Weise offsetTop/offseLeft
Javascript Eigenschaften nicht mit einer CSS-Übersetzung zu ändern sind. Daneben könnte die Position des Elements auch sein (und somit z-index
nicht erforderlich ist)
Wenn Sie stattdessen position: relative
verwenden, ändern Sie diese Eigenschaften, um visuell den gleichen Effekt zu erzielen.
Beispiel Fiddle: http://jsfiddle.net/LkLey/
Natürlich, wenn Sie mit alten Browser (wie IE8
oder FF2
) die notwendige Wahl relative Positionierung zu tun haben, sonst kann ich keine klare Bequemlichkeit sehen auf einer der beiden die Wahl Methoden (naja, um ehrlich zu sein, relative Positionierung hat keine Notwendigkeit, Multiple Präfixe -moz-
, -webkit-
... überall zu arbeiten) so die Wahl liegt bei Ihnen (und es hängt vom Layout ab).
Sorry, ich bin ein wenig verwirrt. Warum werden die CSS-Eigenschaften "Oben", "Links", "Rechts" oder "Unten" nicht verändert? Ich meine alle diese Eigenschaften setzen die entsprechende Kante eines Elements zu einer Einheit nach links/rechts/oben/unten zu seiner normalen Position. Wenn Sie die translate-Methode verwenden, um ein Element von seiner normalen Position weg zu bewegen, sollten sie entsprechend geändert werden zu meinem Verständnis. – chaonextdoor
@chaonextdoor, siehe mein Beispiel fiddle: http://jsfiddle.net/LkLey/ – fcalderan
@chaonextdoor: Transformationen funktionieren ziemlich anders als Ihre normale relative Positionierung. Wenn Sie beispielsweise eine 3D-Transformation hatten, wie sollten die Offsets eines Elements berechnet werden? – BoltClock