Rendre la barre du menu fixe ?

Bonjour,
Le sujet a été abordé, mais je n'ai pas encore trouvé de solution, celles qui figurent ici https://pluxopolis.net/une-barre-des-menus-fixe.html ne fonctionnent pas, existe t-il une vraie solution pour obtenir une barre de menu fixe pour un PluXml 5.8.6 ?

Réponses

  • cpalocpalo Member
    avril 2021 modifié

    Bonjour
    Tu peux utiliser position: sticky; ou position: fixed;
    https://developer.mozilla.org/fr/docs/Web/CSS/position
    Si tu utilises le thème par défaut de Pluxml avec PluCss il y a une classe .sticky qui est appliquée sur le header.

  • Bonjour,
    Merci pour ton aide, j'utilise le theme par défaut
    j'ai essayé des trucs en modifiant le fichier theme.css comme ceci: en remplaçant à partir de la ligne 69 le code suivant
    .nav { text-align: right; padding-top: 0; }
    par
    .nav { text-align: right; padding-top: 0; position: sticky; top: 0 }
    mais ça ne marche pas !
    Qu'est-ce qui manque ?

  • bazooka07bazooka07 PluXml Lead Developer, Moderator

    Bonjour,
    On a dit la class sticky sur le header dans header.php :

    <body id="top" class="page mode-<?php $plxShow->mode(true) ?>">
    
        <header class="header sticky">
    
            <div class="container">
    
    
  • Hooaa !
    Merci bazooka07 c'est super ! le rendu est nikel.

  • cpalocpalo Member

    Par contre c'est vrai que dans le thème par défaut, il y a un choix qui a été fait au niveau des mediasqueries :
    La position sticky n'est appliquée que dans la position mobile ( quand on a le menu hamburger).
    Il faudrait donc modifier dans theme.css la mediaquerry en question pour que la position sticky le soit tout le temps ( ce qui est le cas dans plucss.css)

    @media (max-width: 767px) {
        .header {
            position: sticky;
            top: 0;
        }
    
Connectez-vous ou Inscrivez-vous pour répondre.