IPB

Bienvenue invité ( Connexion | Inscription )

> Ajouter une couleur spécial à l’entête sur la page d’accueil [Résolu], Html, css, javascript
Options
Marshall45
posté 29 Jul 2019, 00:59
Message #1


Nouveau Membre


Groupe : Membres
Messages : 7
Inscrit : 29 Jul 2019
Membre no 208 488



Bonjour,

Actuellement je développe un site, et j'ai quelques petits problèmes sur l’header (l'entête principal).

Le site :
" monveloelectrique.store "

Quelqu'un a t'il un tuto pour ajouter une couleur spécial à la police de l'entête afin qu'elle soit blanche sur l'index (page principal), et noire sur les autres pages ?



Aussi, et si vous savez résoudre ce problème je saurais m'en rappeler

Sur l'header (l'en-tete), j'ai un bouton " up " (une flèche qui monte, et qui me permet (quand je clic dessus) de revenir en haut de la page avec un défilement en douceur. Ce bouton fonctionne, et je n'ai pas de message d'erreur, mais...

Il devrait être invisible lorsqu'on se trouve déjà tout en haut de la page. Or quand j'actualise la page je le vois tout en haut, c'est seulement quand je descend et je remonte tout en haut qu'il disparaît, et devient normal.

Je ne comprends pas pourquoi le bouton up apparaît tout en haut, car je ne vois pas d'anomalie sur mon code.

Voilà mon code si êtes d'accord pour m'aider s'il vous plait, ça m'arrangerait beaucoup


HTML
<li id="btn-up" class="btn-icone"> <a href="#haut"><button>
<img src="https://cdn.shopify.com/s/files/1/0057/4986/6567/files/up.png?6952"
style="height:30px"></button></a></li>




JAVASCRIPT
Code
$(document).ready(function() {
    $(window).scroll(function() {
      if ($(window).scrollTop() == 0) {
            $('#btn-up').fadeOut("slow");
        } else {
            if ($('#btn-up').length == 0) {
                $('body').append('<div id="btn-up">');
            }
            $('#btn-up').fadeIn("slow");
        }
    });
    $('body').on('click', '#btn-up a', function(event) {
        event.preventDefault();
        $('html,body').animate({
            scrollTop: 0
        }, 'slow');
    });
});

Go to the top of the page
 
+Quote Post
 
Start new topic
Réponse(s)
scoch
posté 30 Jul 2019, 20:49
Message #2


Macbidouilleur d'Or !
*****

Groupe : Membres
Messages : 4 933
Inscrit : 1 Jul 2010
Membre no 156 073



Ton CMS semble appliquer à body une classe qui correspond au template utilisé par les pages.
Dans le cas de la page d’accueil c’est la classe « template-index », pour une fiche technique c’est « template-page ».
Tu n’as qu’une règle CSS à ajouter.
Code
/* par défaut */
#btn-menu { color: blue; }
/* pour la page d’accueil */
.template-index #btn-menu { color: red; }


--------------------
L'homme n'est que poussière... c'est dire l'importance du plumeau ! Alexandre Vialatte
Go to the top of the page
 
+Quote Post
Marshall45
posté 31 Jul 2019, 00:25
Message #3


Nouveau Membre


Groupe : Membres
Messages : 7
Inscrit : 29 Jul 2019
Membre no 208 488



Citation (scoch @ 30 Jul 2019, 20:49) *
Ton CMS semble appliquer à body une classe qui correspond au template utilisé par les pages.
Dans le cas de la page d’accueil c’est la classe « template-index », pour une fiche technique c’est « template-page ».
Tu n’as qu’une règle CSS à ajouter.
Code
/* par défaut */
#btn-menu { color: blue; }
/* pour la page d’accueil */
.template-index #btn-menu { color: red; }

Merci infiniment grâce à toi je viens de terminer mon entête ça fait plusieurs jours j'étais dessus je ne sais pas comment vous remercier tous

MacBidouille meilleur forum de développent web y a rien à dire

Force à vous

Ce message a été modifié par Marshall45 - 31 Jul 2019, 00:42.
Go to the top of the page
 
+Quote Post

Les messages de ce sujet


Reply to this topicStart new topic
1 utilisateur(s) sur ce sujet (1 invité(s) et 0 utilisateur(s) anonyme(s))
0 membre(s) :

 



Nous sommes le : 18th July 2025 - 09:49