Signaler

InnerWidth ne marche pas [Résolu]

Posez votre question Garig - Dernière réponse le 3 sept. 2017 à 15:13 par Garig
Bonjour,

J'essaie de changer la couleur de mon titre en dessous de 400px (taille de la fenetre)

Mais ça marche pas... Pouvez-vous m'aider svp?

<h1>Salut</h1>


var titre=document.querySelector('h1');
if (window.innerWidth < 400 ) {
titre.style.color="red";
}




Utile
+0
plus moins
Bonjour,

Commence par faire un console.log de la variable et regarde ce qu'elle te retourne.

Donnez votre avis
Utile
+0
plus moins
Ok merci de ta réponse

En fait ça marche mais quand je redimensionne la fenetre manuellement, la couleur reste figé dans l'état au moment ou j'ai ouvert la fenetre.

Je vois pas le changement s'effectuer quand je redimensionne manuellement la fenetre en dessous et au dessus de 500px.

Je sais pas du tout ce qu'il faut que je fasse pour ça...
Est ce qu'il faut que je créé une fonction en plus? Et quelle méthode javascript utiliser?

Merci
jordane45 18306Messages postés mercredi 22 octobre 2003Date d'inscription ModérateurStatut 21 septembre 2017 Dernière intervention - 3 sept. 2017 à 14:42
Le .resize puisque c'est lors du redimensionnement que tu veux...
Répondre
Garig 52Messages postés vendredi 12 juin 2009Date d'inscription 10 septembre 2017 Dernière intervention - 3 sept. 2017 à 15:13
Ok merci J'ai trouvé la solution. Je marque comme résolu :-)

	window.addEventListener("resize", function(){
var titre=document.querySelector('h1');
if (window.innerWidth > 500 ) {
titre.style.color="yellow";
}else{
titre.style.color="red";
}
});
Répondre
Donnez votre avis
Utile
+0
plus moins
En fait il faudrait que je puisse recharger la page à chaque instant. Je sais pas quelle méthode javascript utiliser? Si c'est .load() ou .resize()? ou alors les 2 ensembles? As-tu une piste pour m'éclairer?

Merci
Donnez votre avis
Utile
+0
plus moins
J'ai essayé de faire ça mais ça marche pas

 window.onload = rafraichir;
window.onresize = rafraichir;
function rafraichir(){
var titre=document.querySelector('h1');
if (window.innerWidth > 500 ) {
titre.style.color="yellow";
}else{
titre.style.color="red";
}
console.log(window.innerWidth)
}
Donnez votre avis

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes.

Le fait d'être membre vous permet d'avoir des options supplémentaires.

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !