CSS:hoverルールへの移行をアニメーション化することは可能ですか?スクリプトで指定したものにアニメーション化するのではなく、CSSで指定したものにアニメーション化することを意味します。
3 に答える
CSSトランジションは、最新のブラウザーで広くサポートされています。
CSSトランジションよりも幅広いサポートが必要な場合は、jQueryを使用して.animate
ください。
:hover
ただし、疑似クラスに入れたスタイルをjQueryに認識させることはできません。変化するスタイルをJavaScriptで個別にコーディングする必要があります。(スタイルが適切なクラスに追加された場合は、jQuery / JSのトリックを使用してスタイルを抽出できますが、疑似クラスは使用できません。)
何を移行するかは正確にはわかりませんが、色の移行を簡単にするjsfiddleを次に示します。いくつかのブラウザについて説明しました。
はい、それは可能であり、より高速です。CSS3は、ハードウェアアクセラレーションを利用して、バターをスムーズにします。Modernizrを使用して、ブラウザーがCSS3トランジションをサポートしているかどうかを確認してから、animateを使用してjQueryフォールバックサポートを提供することをお勧めします。
CSS3トランジションは次のように機能します http://jsfiddle.net/zzKYC/
編集:これは、jQueryのanimateメソッドを使用したModernizrフォールバックサポートを備えたCSS3トランジションの完璧な例でもあります