Partage
  • Partager sur Facebook
  • Partager sur Twitter

changer d'image au survol d'une autre avec un hove

    24 novembre 2021 à 16:55:11

    Bonjour, je dois créer un site pour lundi et j'aurai besoin d'aide pour un hover. 

    J'ai une image que je voudrais remplacer quand on la survole mais rien ne se passe quand je passe dessus mise à part le pointeur.

    Voici mon HTML et mon CSS

    l'HTML

        <a href="concourschaussure.php"><img class="lachaussure" img src="ultimechaussure.jpg" height="70%" width="71%"></a>
    

    et le CSS

    .lachaussure{
        width : 71%;
        height : 70%;
        display : block; 
        background : url("ultimechaussure.jpg") no-repeat;
    }
    
    .lachaussure:hover{
        background-image : url("chaussure.jpg");
    }
    




    -
    Edité par KarlRichard1 24 novembre 2021 à 17:26:19

    • Partager sur Facebook
    • Partager sur Twitter
      24 novembre 2021 à 17:18:32

      Bonjour,

      merci d'utiliser le bouton </> et non des images pour poster les codes HTML et CSS

      Sinon, je vois que on a une image dans la div <img> avec la classe .lachaussure, et en plus une image de fond

      On ne met jamais une image en background d'une div <img...>, c'est idiot

      donc solution : enlever la balise img qui ne sert à rien, et ajouter à  l'élément parent la classe 'lachaussure'

      mais comme c'est un ancre, il faut la passer en inline-block pour qu'elle ait une largeur et une hauteur paramétrable

      Mauvaise idée les dimensions en %, il s'agit de pourcentage de quoi ?

      -
      Edité par ChrisLebure 24 novembre 2021 à 17:23:19

      • Partager sur Facebook
      • Partager sur Twitter
        24 novembre 2021 à 17:20:57

        Bonjour,

        Merci de colorer votre code à l'aide du bouton Code

        Les forums d'Openclassrooms disposent d'une fonctionnalité permettant de colorer et mettre en forme les codes source afin de les rendre plus lisibles et faciles à manipuler par les intervenants. Pour cela, il faut utiliser le bouton Code de l'éditeur, choisir un des langages proposés et coller votre code dans la zone prévue. Si vous utilisez l'éditeur de messages en mode Markdown, il faut utiliser les balises <pre class="brush: xml;">Votre code ici</pre>.

        Merci de modifier votre message d'origine en fonction.

        • Partager sur Facebook
        • Partager sur Twitter

        Pas d'aide concernant le code par MP, le forum est là pour ça :) (en plus je n'y connais rien en C)

        changer d'image au survol d'une autre avec un hove

        × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
        • Editeur
        • Markdown