animate background-color

[artenis]

Bonjour,

je souhaite changer le " background color " de ma div lors d'un animate()

j'ai essayer de nombreuses façons et toutes ont échoués : les voici

Code :

1
2
 
animate({backgroundColor:"#F00"})

Code :

1
2
 
.stop().animate({backgroundColor:"#F00"})

et voici à quel moment je l'insere

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
 
$("#new").click(function() {
				if($("#pseudo-creation").val() == "") {
				$('#new_inscription').show()
					//.css("boxShadow","2px 2px 15px 4px red")
					//.css("background","red")
					.stop().animate({backgroundColor:"#F00"})
					.animate({left : '28%'},{duration: 100})
					.animate({left : '37%'},{duration: 100})
					.animate({left : '31%'},{duration: 100})
					.animate({left : '35%'},{duration: 100})
					.animate({left : '33%'},{duration: 100})
 
					//.css("boxShadow","2px 2px 15px 4px #0FF")
					//.css("background","#3CF")
					;
				return false;
				};

j'aimerais que ma div change de couleur au debut de l'animation et quel revienne à sa couleur initial a la fin de l'animation
avec un css la couleur change au debut , mais si je met le css en plus à la fin la couleur ne change pas du tout (que ce soit au debut ou a la fin de l'animation)
avec animate ca ne marche pas

des idées??

[SpaceFrog]

il te manque juste le plugin
http://plugins.jquery.com/project/color

sinon y'a aussi ça
http://plugins.jquery.com/project/colorBlend

[artenis]

merci bcp pour cette suggestion , c très interressant

en fait j'aimerais resoudre mon probleme sans plugin supplementaire

(je changerais le titre lorsque ce sera résolu)

avec du css la couleur de backgroud change bien au debut de l'animation

Code :

1
2
3
4
5
6
7
8
9
10
11
 
$("#new").click(function() {
				if($("#pseudo-creation").val() == "") {
				$('#new_inscription').show()
					.css("boxShadow","2px 2px 15px 4px red")
					.css("background","red")
					.animate({left : '28%'},{duration: 100})
					.animate({left : '37%'},{duration: 100})
					.animate({left : '31%'},{duration: 100})
					.animate({left : '35%'},{duration: 100})
					.animate({left : '33%'},{duration: 100})

cependant dés que je veux remettre la couleur par defaut à la fin de l'animation, le changement de couleur BG n'a plus aucun effet au debut de l'animation

Code :

1
2
3
4
5
6
 
.delay(600).css("boxShadow","2px 2px 15px 4px #0FF")
.delay(600).css("background","#3CF");
 
				return false;
				};

comme on peut le voir j'ai essayé avec un delay mais ca n'a aucun effet

Si vous me dites que mon probleme ne peut se regler qu'en utilisant les liens que vous m'avez proposez alors j'utiliserais colorblend

merci pour vos suggestions

PS: si ça marche pour changer de couleur au debut de l'animation il doit bien y avoir un moyen pour le changer à la fin de l'animation , n'est ce pas ???? (sans plugin)

[SpaceFrog]

Code :

1
2
.delay(600).css({"boxShadow":"2px 2px 15px 4px #0FF"})
.delay(600).css({"background-color":"#3CF"});

[artenis]

aucun changement , une autre idée ??

[SpaceFrog]

Code :

.delay(600).css({"background-color":"#3CF"});

tout seul donne quoi ?

[Bovino]

.delay() s'applique à des effets. .css() n'est pas un effet, donc ça ne peut pas fonctionner.
Il faut que tu passes par un setTimeout dans le complete du dernier effet.

[artenis]

Code :

1
2
 
.delay(600).css({"background-color":"#3CF"});

Tout seul ca change rien

setTimeout ou sleep ne marche pas non plus

je vais sans odute me rabattre sur le colorblend

merci quand meme