2012-02-17 1 views
0

可能性の重複:
CSS3 animation with gradientsCSS3でグラデーションの不透明度をアニメーション化することはできますか?

次のように私は、コードをラジアル勾配の要素を有する:

background: radial-gradient(center, ellipse cover, rgba(255,255,255,0.65) 0%,rgba(255,255,255,0) 100%); 

Iが不可視から可視に遷移したいです私は、最初のrgba値のアルファ値を変更することによって達成されると信じています。構文がどのように見えるのか分かりません。 CSS3でも可能ですか?

+0

http://stackoverflow.com/questions/5654510/css3-animation-with-gradients – Aaron

答えて

0

勾配の色は、仕様にかかわらず、どのブラウザでもアニメーション化/トランジション可能ではありません。

この効果を得るために、あなたは1

+0

感謝し0からの遷移別の「不透明度」プロパティを追加する必要があります私は擬似要素の前にグラデーションを入れ、あなたが言ったように不透明度を変更します。 FireFoxで動作していますが、何らかの理由でChromeで動作しませんでした。それが擬似要素か何かであるかどうかは分かりませんが、それはまったく別の質問です。私は時間があればそれを見なければなりません。 –

+0

擬似要素にはバグがたくさんあります。多くのCSS効果が適切に機能しないようです。私は、擬似要素に直接的に変換するのではなく、親要素に遷移を置くことを提案します(あるいは、divまたはspanの擬似要素をラップして遷移させること)。 –

+0

アドバイスをいただき、ありがとうございます。 –

関連する問題