2011-01-17 18 views
1

Androidブラウザに関する問題が発生しています。 Androidアプリではなく、通常のHTML5/CSS3ウェブページにはWebkitベースのCSS3アニメーションが含まれています。単純に、私はdiv/sectionを画面上でフェードインしたいだけです。方法私はiOSブラウザでは動作しますが、Androidブラウザでは動作しません。何ここで起こることは起こらないでフェードインされ、その後のオブジェクトではなく、画面に貼り付ける消える:Android/HTML5/CSS3フェードイン問題

section { 
width: 480px; 
height: 100px; 
overflow: hidden; 
position: absolute; 
left: 0px; 
top: 0px; 
background-image: url(images/home/bkg.jpg); 
background-repeat: no-repeat; 
background-position: 0px 0px; 
z-index: 1; 
-o-animation-name: fadeIn; 
-o-animation-duration: 1s; 
-o-animation-delay: 0s; 
    -o-animation-fill-mode: both; 
-moz-animation-name: fadeIn; 
-moz-animation-duration: 1s; 
-moz-animation-delay: 0s; 
    -moz-animation-fill-mode: both; 
-webkit-animation-name: fadeIn; 
-webkit-animation-duration: 1s; 
-webkit-animation-delay: 0s; 
    -webkit-animation-fill-mode: both; 

}

+0

アニメーション化する

の場合、fadeInとHTMLの@keyframe定義を投稿してください。 –

答えて

0

どうやらWebKitのアニメーションフィルモードは、Android上では動作しません。 アニメーションの最後のスタイルを取得し、アニメーションの最後に適用することで、JavaScriptで回避する必要があるかもしれません。

関連する問題