2011-05-30 2 views
3

Je dois animer du transparent au coloré mais quand je le fais j'obtiens un flash blanc. Je suppose que c'est parce qu'il n'y a pas de couleur de base pour animer. Comment puis-je contourner cela?jQuery - animer de transparent à couleur sans flash blanc?

$('#nav a').hover(function() { 
    $(this).animate({ 
     'background-color' : $(this).attr('data-background'), 
     'color' : $(this).attr('data-rollover') 
    }, 900); 
}); 

<a style="color:#ffff00; " data-background="#000066" data-color="#ffff00" data-rollover="#000000" href="index.php?p=1" ><span >Home</span></a> 

Répondre

5

Animer le opacity au lieu de la propriété background-color.

1

Alex a raison. vous l'avez fait avec opacity. Vous pouvez essayer ceci:

$('#nav a').hover(function() { 
    $(this).animate({ 
     'opacity': 0 
    }, 
    1, 
    function() { 
     $(this).css({ 
      'background-color': $(this).attr('data-rollover'), 
      'color': $(this).attr('data-color') 
     }).animate({ 
      'opacity': 1 
     }, 
     900); 
    }); 
}); 
+0

@John Smith Salut mon ami, je sais que 'background-color' ou' color' ne peuvent pas être animés. – thecodeparadox

+0

Vous avez besoin du plugin * colors * pour animer les couleurs. – alex