Problème avec les ancres sur mobile + menu (Créer un compte)

  • WordPress :5.4
  • Statut : non résolu
2 sujets de 1 à 2 (sur un total de 2)
  • Auteur
    Messages
  • #2342924
    Adriano
    Participant
    Initié WordPress
    2 contributions

    Bonjour,

    Ma configuration WP actuelle

    • Version de PHP/MySQL :PHP 7.3
    • Thème utilisé : Divi photography
    • Extensions en place :
    • Nom de l’hébergeur : Infomaniak

    Problème(s) rencontré(s) :

    Bonjour à tous,

     

    Je rencontre actuellement deux problèmes avec mes ancres paramétrées via l’ ID CSS et enregistrées dans le menu (http://www.biosphair-coiffure.ch).

    1. Les titres du menu qui comportent l’ancre restent sélectionnés comme si on passe dessus avec la souris (sulignés en vert: ma vision, mes produits, contact). Il faut aller voir sur le site pour comprendre ce que je vous dire je pense. Je souhaite qu’ils restent blanc.
    2. L’ ancre pour “ma vision » ne fonctionne pas sur mobile. Pour une petite partie du site, il y a en effet deux sections. La section 1 n’est visible que sur ordinateur et tablette. La section 2 n’est visible que sur mobile (la section comporte une image, question de format). Or, les deux sections ont la même ID CSS et l’onglet du menu « Ma vision » renvoie à cette ID CSS. Cela fonctionne pour la section 1. Par contre, sur mobile, où seul la section 2 est visible mais qui comporte la même ID CSS, le lien ne fonctionne pas.

    Pouvez-vous m’aider?

     

    Adriano.

    • Ce sujet a été modifié le il y a 2 semaines par Adriano.
    #2343064
    Adriano
    Participant
    Initié WordPress
    2 contributions

    Pour info pour le point 1., j’ai utilisé le code CSS suivant (sous DIVI):

     

    #top-menu .current-menu-item a::before,
    #top-menu .current_page_item a::before {
    content: “”;
    position: absolute;
    z-index: 2;
    left: 0;
    right: 0;
    }
    #top-menu li a:before {
    content: “”;
    position: absolute;
    z-index: -2;
    left: 0;
    right: 100%;
    bottom: 50%;
    background: #15bf86; /*** COLOR OF THE LINE ***/
    height: 3px; /*** THICKNESS OF THE LINE ***/
    -webkit-transition-property: right;
    transition-property: right;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    }
    #top-menu li a:hover {
    opacity: 1 !important;
    }
    #top-menu li a:hover:before {
    right: 0;
    }
    #top-menu li li a:before {
    bottom: 10%;
    }

2 sujets de 1 à 2 (sur un total de 2)
  • Vous devez être connecté pour répondre à ce sujet.