1. ホーム
  2. Web制作
  3. CSS

[css3]css3のtransformの遷移のジッターの問題を解決しました。

2022-02-03 12:20:34

transform: scale(); IEで拡大縮小するとジッターが発生する。

transformはIEでジッターになるようにスケーリングします。スケーリングに回転を追加することができます

例えば

transform: scale(1.2);

に置き換えてください。

transform: scale(1.2) rotate(0.1deg);

transform:translate(); オフセットで画像やテキストをぼかします。

トランスフォームのオフセットは、画像やテキストがフレームから外れてぼやけますが、これは clac

例えば

transform:translate(-50%);

に置き換えてください。

transform: translate(calc(-50% + 1px));

clacは、スタイル内の計算に使用できるcss3の計算プロパティです。clacの構文: clac(number + number) Note: the spaces at the ends of the "operator" must be left intact

transformは互換性があり、IEはIE9のみ互換性があり、以下のように記述されます。

transform:scale(1.2) rotate(0.1deg);
-ms-transform:scale(1.2) rotate(0.1deg); /* IE 9 */
-moz-transform:scale(1.2) rotate(0.1deg); /* Firefox */ 
-webkit-transform:scale(1.2) rotate(0.1deg); /* Safari and Chrome */ 
-o-transform:scale(1.2) rotate(0.1deg); /* Opera */

css3 transform transition jitterの問題解決について、この記事を紹介し、より関連するcss3 transform transition jitterの内容は、スクリプトハウス過去の記事を検索してくださいまたは、次の関連記事を閲覧し続け、あなたが将来よりスクリプトハウスをサポートして願っています!。