modifier un gradient en javascript

**McNova** · 15/01/2019, 20h01

Bonjour ,
actuellement en terminal je suis s�r un projet final , dans celui-ci j'ai un gradient (initialement du noir vers le gris) que je voudrais changer (noir vers rouge par exemple) en appuyant sur une touche
voici mon code javascript:

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
function keyPressed(){
	 if(keyCode == 122){
              alert("si tu vois ce message la fonction c'est bien lancé");
              document.getElementById("page").style.background="radialGradient(black,black,red)";
	}
}

Dans mon html j'ai donn� une id � la balise html <html id="page"> et dans le css j'ai :

Code CSS :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
html {
	height: 100%;
	background: radial-gradient(black,black,#0b46a3);
	background-repeat: no-repeat;
 }

Ps: j'ai enti�rement conscience que on ne donne jamais d'id � une balise html mais plut�t au body ainsi que mon code est s�rement horrible mais j'ai tout cod� et �a fonctionne et ici je ne m'int�resse que de comment modifier mon radial-gradient en java ( d�sol� pour les fautes )
merci de votre aide.

**ProgElecT** · 15/01/2019, 20h33

Salut

Je crois me rappeler qu'il faut passer document.getElementById("page").style.backgroundImage=......
plut�t que document.getElementById("page").style.background=.....

**McNova** · 15/01/2019, 20h47

Envoy� par ProgElecT

Salut

Je crois me rappeler qu'il faut passer document.getElementById("page").style.backgroundImage=......
plut�t que document.getElementById("page").style.background=.....

Tout d'abord merci de ta r�ponse , j'ai remplac� et voici mon nouveau code javascript :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
function keyPressed(){
	 if(keyCode == 122){
            document.getElementById("page").style.backgroundImage="radialGradient(black,black,red)";
}

j'avais d�j� cru comprendre que le gradient est consid�r� comme une image mais cette solution n'a pas march�
merci.

**ProgElecT** · 15/01/2019, 21h29

Re

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

document.getElementById("page").style.backgroundImage="radial-gradient(black,black,red)";

**Beginner.** · 16/01/2019, 17h00

Salut,

Regarde bien la r�ponse de ProgElecT, il y a une diff�rence dans les noms de propri�t�s selon qu'on les utilise en CSS ou en JS, regarde ces liens :

- Comment passer d'une propri�t� de style CSS � celle qui correspond en JavaScript ?
- Quelle est la correspondance d'un attribut CSS en JavaScript ?

Envoy� par McNova

Ps: j'ai enti�rement conscience que on ne donne jamais d'id � une balise html mais plut�t au body ainsi que mon code est s�rement horrible mais...

Oui mais c'est inutile, tu n'as pas besoin d'ID... Pour acc�der au body tu peux faire document.body... Et pour ton pb : document.body.style.backgroundImage="radial-gradient(black,black,red)"; et cela fonctionne...

**McNova** · 17/01/2019, 11h39

Merci pour votre aide , �a marche nickel !

modifier un gradient en javascript

JavaScript

Discussions similaires

Partager

Partager