1

0レスポンシブ レイアウトの Web アプリの CSS アニメーションに取り組んでいます。私のアニメーションのいくつかは、いくつかのコンテナの幅と背景画像の位置を調整します。その結果、次のようなものがあります(簡潔にするためにプレフィックスは省略されています):

/* Default styles */

.box { animation: grow 1s ease; }

keyframes grow {
    0% {
        width: 100px;
    }
    100% {
        width: 200px;
    }
}

/* Large display styles */

@media (min-width: 1200px){

   keyframes grow {
       0% {
          width: 200px;
       }
       100% {
           width: 300px;
       }
   }

}

CSS Tricksに関するこの投稿によると、Win7 の IE10 はメディア クエリ内のキーフレームを無視します。私はその理論をテストし、それが真実であることを発見しました。

誰もがこれに対する回避策を見つけましたか?

4

3 に答える 3