Comment réaliser un dégradé en arrière plan en JavaScript ?

Par wYm, il y a 15 ans


Bonjour a tous, je suis sur un projet où je veux mettre en arrière plan un dégradé, bon moi j'ai crée un dégradé de 1px qui se répète, mais le problème avec le dégradé c'est si la hauteur change il va y avoir un problème il va se répéter en y et même si je fait repeat-x ça ne règle pas le problème. Alors je voudrais qu’au lieu de mettre un dégradé avec une image le faire en javascript pour qu'il soit dynamique, donc si quelqu'un sais comment faire ... qu'il me donne la solution
a mon problème.
Merci pour vos éventuelles réponses :)

4 réponses

GentlemanOwl, il y a 15 ans

Au lieu de js tu peux utiliser le css3. Avec linear et radial gradient après les règles diffère selon le navigateur ce qui est un peu énervant au moment de coder.

Sinon tu utilises Compass, et il se charge du sale boulot pour toi LOL

wYm, il y a 15 ans

merci pour ta réponse, sinon pour la première question tu n'a pas un lien (tuto) a me proposer ???

GentlemanOwl, il y a 15 ans

heu je vois pas trop ... peut être ceci:

Lien

Voilà les règles pour safari, chrome et firefox :

background-image: -webkit-gradient(linear, 0% 100%, 0% 0%, color-stop(0%, #ffffff), color-stop(100%, #000000));
  background-image: -moz-linear-gradient(bottom, #ffffff 0%, #000000 100%);
  background-image: linear-gradient(bottom, #ffffff 0%, #000000 100%);

Et le tuto devrait bien t'expliquer les histoires de couleur de début, couleur de fin, type de dégradé ainsi que les pourcentages.

wYm, il y a 15 ans

Merci beaucoup pour ton aide