[Javascript] [HTML] Hover

Discussione in 'Javascript' iniziata da Giacomo Boccherini, 17 Marzo 2019.

  1. Giacomo Boccherini

    Giacomo Boccherini Nuovo Utente

    Registrato:
    17 Marzo 2019
    Messaggi:
    12
    Mi Piace Ricevuti:
    0
    Punteggio:
    1
    Sesso:
    Maschio
    Salve a tutti
    Avendo un DIV parent
    Con all'interno 2 elementi child (A e B)
    Vorrei all'hover del div un opacity 0 sull'elemento A e un opacity 1 sull'elemento B.

    grazie a tutti
     
  2. WmbertSea

    WmbertSea Utente Attivo

    Registrato:
    28 Novembre 2014
    Messaggi:
    147
    Mi Piace Ricevuti:
    20
    Punteggio:
    28
    Ciao, nulla di così complicato. Anche senza utilizzare JavaScript puoi risolvere con del semplice css.
    Codice:
    <!doctype html>
    <html lang="it">
       <head>
          <title>hover parent & child</title>
         
          <style>
             #parent{
                padding: 10px;
                width: 200px;
                background: silver;
             }
             #parent:hover>.childA{
                opacity: 0;
             }
             .childA{ background: red; }
             .childB{ background: green; }
          </style>
         
       </head>
       <body>
     
          <div id="parent">
             <div class="childA">Child A</div>
             <div class="childB">Child B</div>
          </div>
         
       </body>
    </html>
    Chiaramente per il childB non c'è bisogno di impostare opacity 1 dal momento che è già così.
     
    Ultima modifica: 19 Marzo 2019
Sto caricando...

Condividi questa Pagina