誰かにとってはかなり簡単な質問です。私のウェブサイトのCSSでは、私はtranslate3d()
を使って素晴らしいアニメーションを作りました。問題は、これらのアニメーションはすべて2次元であることです。適用可能な場合はGPUレンダリングを利用するために、私はちょうどtranslate3d()
を利用しています。 transform: translate(50%, 50%);
は、GPUブーストせずに、同じ視覚効果を達成するのに対し、css、translate()vs translate3d()support
transform: translate3d(50%, 50%, 0);
し、それをアニメーション化:つまり
、私は次のようなものを使用してきました。
私はCanIUseをちょっと見ていましたが、残念なことにInternet Explorerの場合は、translate3d()
のサポートに欠けています.2D変換のサポートは、少なくとも私にIE 9へのアクセスを与えます。translate3d()
を使用している場合は、私はIE 9にアクセスできます。 IEはその特定のプロパティをサポートしていませんが、XとYの変換のみを使用していて、それでもレンダリングしていることを認識しますか?それとも、すべてを通常の古いものに切り替える方がよいでしょうかtranslate()
?
私が言ったように、私が嫌う唯一の理由は、複雑なアニメーションではGPUアクセラレーションが持つのがうれしいからです。
IEが自動的にフォールバックしない(私が期待して恐れている)場合は、サポートするブラウザでGPUレンダリングを利用できるように他の技術を提供できますか?
2dと3dの両方の変換をCSSで(その順番に)リストして、IEがtranslate3d()
を無視するようにするか、余分なリソースを消費する可能性がありますか?
事前にお問い合わせいただきありがとうございます。
可能な重複使用されます[検出 "変換を:translate3dの支援を] (http://stackoverflow.com/questions/5661671/detecting-transform-translate3d-support) – Vucko
返信いただきありがとうございました。私は実際にその投稿を見つけられませんでしたが、重複しているとは思いません。私の主な質問は、3番目の変数にかかわらず、変換が本質的に2次元であったためにIEが後退するかどうかということでした。しかし、その記事はかなり面白く見えるし、私は読んでみる必要があります、ありがとう! –