Discussion :

[leymiris]

Bonjour,

Voilà pour un nouveau site que je suis entrain de faire j'ai mis en place en background du site internet trois type de nuage différent qui défile. Malheureusement ayant une vitesse plutôt réduite on observe des saccade-ment des différents nuages. Je pose la question sans vraiment savoir si c'est normal que ça traine un peu.

Ce n'est pas une question de taille d'image car chacune fait 85 ko difficile de faire plus petit
Ce qui est aussi étonnant c'est que en local les nuages saccades moins sur mon ordinateur fixe que sur mon portable.

Voici le bout de code :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
function animateCloud1(){
		//var positionInit = Math.random() * 3592;
 
		$("#cloud1").css({backgroundPosition:"0 0"})
		 .animate({backgroundPosition:"3592px 0"},250000,"linear",animateCloud1);	 
	}
	animateCloud1();

Il est répète 3 fois pour les trois niveaux de nuages. Avant vous déjà eu ce genre de soucis ? Il est fort probable que rien ne soit faisable et ce serais dommage car les nuages qui bouge en fond fait belle effet

Je vous remercie d'avance pour vos avis.

[Watilin]

Salut,
ça va pas mal dépendre de la machine du visiteur. S’il a un 80-core à l’azote liquide, ça passera niquel, mais sur un P1 y’a des chances que ça soit pas tout à fait fluide Quant à la différence entre ton fixe et ton portable, ça peut venir de tout un tas de choses ^^
Mais je sais d’expérience qu’il y a en général plus de process sur un portable, et donc plus de charge pour le CPU.

Après, ça dépend aussi du navigateur, ils ont sûrement pas tous les mêmes optimisations (et ça, c’est des infos difficiles à avoir). Mais je pense que des images de fond animées, c’est quelque chose de moins courant que des éléments HTML qui se déplacent, et les optimisations ont pu se faire en ce sens.
Donc je te conseille d’essayer une version – si c’est possible bien sûr – avec des <div> ou des <img> que tu positionnes en absolu et que tu dépaces avec left et top (ou autre), et de comparer la chose sous un max de navigateurs différents, pour voir quelle solution retenir.

Bon courage

[leymiris]

ok, je ne pensais pas que la puissance de mon ordinateur pouvais influencer le traitement jquery des animations que je fais sur un site internet.

j'ai déjà fait en jouant avec le changement du left à la place du position background. Mais je crois que l'image etait en background du div tout de même. Je vais faire un essai en mettant l'image dans le div et je repasse par là