css Übergang auf Hintergrundbild Farbverlauf

Question

Ich habe ein Hintergrundbild in meinem CSS3 mit Bild und Farbverlauf definiert. Ich möchte auch einen Übergang haben, wenn die Klasse von on_time wechselt -> too_late oder umgekehrt.

Ich kann den Übergang auf dem Gradienten nicht erhalten. Wird das irgendwie in css3 unterstützt?

Dank

div.too_late 
{ 
    color: White;   
    background-image: url(../Content/images/uit_white.png), -webkit-linear-gradient(top, #feb233 0%, #f39801 100%);  

    -webkit-transition-property: background-image, color; 
    -webkit-transition-duration: 5s;  
} 

div.on_time 
{ 
    color: #222;   
    background-image: url(../Content/images/uit_black.png), -webkit-linear-gradient(top, yellow 0%, #99ff33 100%);  

    -webkit-transition-property: background-image, color; 
    -webkit-transition-duration: 5s;   
} 

Answer 1

Es ist nicht möglich, Übergänge auf den Hintergrund Gradienten zu haben. Aber Sie können unter diesem Link einen Blick auf sie mit „Hacks“ funktioniert: http://nimbupani.com/some-css-transition-hacks.html

Sie können es auch erscheinen lassen, wie es unter Verwendung der Hintergrund-Positionsverschiebung zu ändern ist: http://sapphion.com/2011/10/css3-gradient-transition-with-background-position/

Hier ist eine ähnliche Frage btw mit mehr Links und Informationen: Use CSS3 transitions with gradient backgrounds

Answer 2

„Gradients unterstützen keine Übergänge noch (obwohl die Spezifikation sagt sie sollte) Wenn Sie einen Fade-in-Effekt mit einem Hintergrund Gradienten möchten, können Sie haben zu setzen. eine Opazität auf dem Behälter und Übergang der Opaci ty. "

Quelle: Use CSS3 transitions with gradient backgrounds

Answer 3

Die Eigenschaft background-image nicht

unterstützt wird

http://www.w3.org/TR/css3-transitions/#animatable-css