slash: CSS Animation -> Funktioniert in chrome, aber nicht in Firefox

Hallo,

ich habe hier eine einfache css3-animation die den Hintergrundfarbenwechsel eines linkes animiert. Das funktioniert auch wunderbar, nur leider im Firefox nicht.

Hat jemand eine Idee warum, das ganze nicht funktionert?

<html>  
<head>  
<style type="text/css">  
  
.flRowEven{  
	width:100px;  
	  
}  
  
@-webkit-keyframes fade {  
from {  
    background:red;  
    -webkit-transform: background-color;  
	-moz-transform: background-color;  
}  
to {  
    background:blue;  
    -webkit-transform: background-color;  
	-moz-transform: background-color;  
    }  
}  
  
  
  
.flRowEven  {  
    -webkit-animation-name: fade;  
    -webkit-animation-iteration-count: 1;  
    -webkit-animation-timing-function: linear;  
    -webkit-animation-duration: 1s;  
	  
	-moz-animation-name: fade;  
    -moz-animation-iteration-count: 1;  
    -moz-animation-timing-function: linear;  
    -moz-animation-duration: 1s;  
}  
  
</style>  
</head>  
  
<body>  
  
<div>  
	<a href="#" onclick="document.getElementsByTagName('div')[0].className='flRowEven'">link</a>  
</div>  
  
</body>  
</html>
  1. Hi,

    @-webkit-keyframes fade {
    from {
        background:red;
        -webkit-transform: background-color;
    -moz-transform: background-color;

    wenn der ganze fade-Block -webkit- spezifisch ist, wie hoch ist die Wahrscheinlichkeit, daß ein Firefox das -moz-transform darin sieht?

    cu,
    Andreas

    --
    Warum nennt sich Andreas hier MudGuard?
    O o ostern ...
    Fachfragen per Mail sind frech, werden ignoriert. Das Forum existiert.
    1. Hi,

      @-webkit-keyframes fade {
      from {
          background:red;
          -webkit-transform: background-color;
      -moz-transform: background-color;

      wenn der ganze fade-Block -webkit- spezifisch ist, wie hoch ist die Wahrscheinlichkeit, daß ein Firefox das -moz-transform darin sieht?

      cu,
      Andreas

      Ups... ja stimmt, aber auch wenn das korrigiert habe, funktioniert das nicht :/

      <html>  
      <head>  
      <style type="text/css">  
        
      .flRowEven{  
      	width:100px;  
      	  
      }  
        
      @-webkit-keyframes fade {  
      from {  
          background:red;  
          -webkit-transform: background-color;  
      }  
      to {  
          background:blue;  
          -webkit-transform: background-color;  
          }  
      }  
        
      @keyframes fade2 {  
      from {  
          background:red;  
      	-moz-transform: background-color;  
      }  
      to {  
          background:blue;  
      	-moz-transform: background-color;  
          }  
      }  
        
        
      .flRowEven  {  
          -webkit-animation-name: fade;  
          -webkit-animation-iteration-count: 1;  
          -webkit-animation-timing-function: linear;  
          -webkit-animation-duration: 1s;  
      	  
      	-moz-animation-name: fade2;  
          -moz-animation-iteration-count: 1;  
          -moz-animation-timing-function: linear;  
          -moz-animation-duration: 1s;  
      }  
        
      </style>  
      </head>  
        
      <body>  
        
      <div>  
      	<a href="#" onclick="document.getElementsByTagName('div')[0].className='flRowEven'">link</a>  
      </div>  
        
      </body>  
      </html>  
        
      
      
      1. Hi,

        Ups... ja stimmt, aber auch wenn das korrigiert habe, funktioniert das nicht :/

        Hast Du denn einen 5er Firefox?

        cu,
        Andreas

        --
        Warum nennt sich Andreas hier MudGuard?
        O o ostern ...
        Fachfragen per Mail sind frech, werden ignoriert. Das Forum existiert.
        1. Ja hab ich

          Hi,

          Ups... ja stimmt, aber auch wenn das korrigiert habe, funktioniert das nicht :/

          Hast Du denn einen 5er Firefox?

          cu,
          Andreas

          1. Om nah hoo pez nyeetz, slash!

            Hast Du denn einen 5er Firefox?

            Ja hab ich

            Die Computerbild schreibt, dass die geplanten Funktionen in die Beta noch nicht eingebaut wurden. Allerdings ist das schon 'ne Weile her. Schau doch mal nach der aktuellen Version (b3).

            Matthias

            --
            1/z ist kein Blatt Papier. http://www.billiger-im-urlaub.de/kreis_sw.gif
          2. Om nah hoo pez nyeetz, slash!

            in der 5.0b3 werden diese Beispiele richtig dargestellt.

            Matthias

            --
            1/z ist kein Blatt Papier. http://www.billiger-im-urlaub.de/kreis_sw.gif