Comment changer le background du headerbar en javascript ?

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Comment changer le background du headerbar en javascript ?

Message par stefou le Mer 12 Mar 2014 - 13:17

Bonjour,

En javascript j'utilise cette partie pour changer le background-image du body la nuit.
Code:
document.body.style.backgroundImage="url(\""+nuit+"\")";

Je n'arrive pas à trouver et ajouter la commande pour changer le background-image pour headerbar

Voici le code js complet
Code:
$(function(){
var nuit = ["http://i55.servimg.com/u/f55/17/67/21/72/etoile10.gif"];
var date=new Date();
var heure=date.getHours();
if (heure >= 22)
document.body.style.backgroundImage="url(\""+nuit+"\")";
else if (heure <7)
document.body.style.backgroundImage="url(\""+nuit+"\")";
});

Au cas ou, voici un schéma qui montre ou est le headerbar
Image:
http://i55.servimg.com/u/f55/17/67/21/72/header10.png

Merci pour votre aide.


Dernière édition par stefou le Mer 12 Mar 2014 - 18:34, édité 2 fois

stefou
*****

Masculin
Messages : 889
Inscrit(e) le : 24/11/2009

http://discussansfrontieres.forumgratuit.fr/forum
stefou a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Comment changer le background du headerbar en javascript ?

Message par Self le Mer 12 Mar 2014 - 14:10

Bonjour,

Vous désirez changer également le fond du header pour le pour les heures de nuit ou il ne vous faut que lui mettre une image ?

Self
+ Hyperactif +

Masculin
Messages : 3710
Inscrit(e) le : 13/06/2013

Self a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Comment changer le background du headerbar en javascript ?

Message par stefou le Mer 12 Mar 2014 - 17:18

Bonjour, si vous allez sur le forum renseigné dans mon profil, vous allez voir le logo est sur fond noir à gauche et à droite.
Je souhaite y mettre la même image étoilé que dans le body (de nuit).

Je sais le faire via le css, mais comme il ne doit apparaitre que la nuit, je dois trouver le bout de code à ajouter au javascript et je n'y arrive pas...

placer ce bout de css pour voir le résultat.
Code:
.headerbar{background-image:url(http://i55.servimg.com/u/f55/17/67/21/72/etoile10.gif);}

edit: en fait il faut y mettre une image via le js et non pas par le css.

stefou
*****

Masculin
Messages : 889
Inscrit(e) le : 24/11/2009

http://discussansfrontieres.forumgratuit.fr/forum
stefou a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Comment changer le background du headerbar en javascript ?

Message par Self le Mer 12 Mar 2014 - 18:05

Bonjour,

Le code suivant devrait fonctionner:
Code:
$(function(){
    var nuit = "http://i55.servimg.com/u/f55/17/67/21/72/etoile10.gif";
    var date = new Date();
    var heure = date.getHours();
    if (heure >= 22){
        $('body').css('background', 'url('+nuit+')');
        $('.headerbar').css('background', 'url('+nuit+')');
    }else if (heure < 7){
        $('body').css('background', 'url('+nuit+')');
        $('.headerbar').css('background', 'url('+nuit+')');
    }
});

Cordialement Smile .

Self
+ Hyperactif +

Masculin
Messages : 3710
Inscrit(e) le : 13/06/2013

Self a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Comment changer le background du headerbar en javascript ?

Message par stefou le Mer 12 Mar 2014 - 18:16

C'est parfait ! et en plus j'ai compris  Mr. Green 

Un grand merci  thumright 

stefou
*****

Masculin
Messages : 889
Inscrit(e) le : 24/11/2009

http://discussansfrontieres.forumgratuit.fr/forum
stefou a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Comment changer le background du headerbar en javascript ?

Message par stefou le Mer 12 Mar 2014 - 18:36

Pour ceux qui utiliseront ce code,
Pour que le fond soit fixe, il faut ajouter dans le css

Code:
/*image de fond body fixe*/
body{
background-attachment: fixed!important;
}

stefou
*****

Masculin
Messages : 889
Inscrit(e) le : 24/11/2009

http://discussansfrontieres.forumgratuit.fr/forum
stefou a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum