Ich versuche ein JS-Skript zu konvertieren, das für touch-fähige Geräte wie iPads erstellt wurde, damit es mit den Mausgesten verwendet werden kann.
Das Skript verwendet translate3d, was (denke ich) webkit-spezifisch ist, aber ich möchte das in so vielen Browsern wie möglich machen. Also, was ist die CSS3 Alternative zu translate3d?
So wird es im JavaScript verwendet:
%Vor%Meine Kenntnisse in CSS3 sind sehr begrenzt, daher werden alle Beispiele / Erklärungen, die Sie geben können, sehr geschätzt.
Translate3d ist CSS3, die meisten Browser haben es noch nicht implementiert (Chrome / Safari sind die einzigen, die es über Webkit unterstützen). Es ist ein 3-D-Transformations-Stil.
Es gibt auch 2-D-Transformationen, die die Z-Achse ausschneiden, also:
%Vor%wird
%Vor%Glücklicherweise werden 2D-Transformationen meist von allen gängigen Browsern (IE9 und höher) unterstützt, sie benötigen jedoch Browser-Präfixe. In Ihrem Beispiel würde dies wie folgt aussehen:
%Vor% Für ein bisschen mehr auf 2-D und 3-D Transformationen siehe: Ссылка
Ссылка
Der einzige Nachteil von 2-D-Transformationen ist, dass sie im Gegensatz zu 3D-Transformationen nicht GPU-beschleunigt sind. Sehen Sie diesen Link für einige großartige Informationen darüber, wie viel Hardwarebeschleunigung bei Übergängen und Animationen hilft: Ссылка .
Für mehr Browsergüte können Sie eine Funktion schreiben, um den richtigen Browsertransformations-Stil zu finden, der angewendet werden soll (oder bestimmen, dass der Browser Transformationen nicht unterstützt):
%Vor%Sie können auch eine Feature-Erkennungsbibliothek wie Modernizr verwenden.
2D-Transformationen scheinen mehr zu sein weit verbreitet mit Anbieter-Präfixen. Hier ist die W3C-Spezifikation .
%Vor%Sie können Modernizr verwenden, um nach Unterstützung zu suchen .
>Tags und Links javascript css3