come posso ottenere un’immagine all’interno di un altro elemento div per reagire su librarsi sull’elemento div più esterno?

ho una pagina in cui ho un plugin WordPress WPDATATABLES utilizzando HTML per visualizzare alcune informazioni che sto tirando da vari siti (importXML). l’idea è per la pagina di guardare qualcosa di simile a questo https://www.labelradar.com/labels/chillyourmind/profile, che quando si sopra un elemento particolare, l’intero elemento reagisce e cambia in un logo bianco con il colore principale dell’icona dei social media. attualmente, Sono in grado di ottenere tutti i CSS lavorare tranne un piccolo dettaglio, e questa è l’icona bianca. questo cambia solo quando Lei è dentro gamma del profilo d’immagine dell’icona.

ecco la pagina: https://trapparty.net/theparty/

so che ci deve essere in qualche modo per forzare il div a reagire allo stesso tempo quando mi librio sull’elemento div più esterno controllare l’intera cosa. ecco un pastbin di tutto il codice CSS che sto usando:

https://www.pastiebin.com/5cf313feb2753

e sotto c’è un elemento HTML con gli elementi DIV nidificati.

ho provato a combinare alcuni CSS come questo per cercare di chiamare il div all’esterno:

.soundcloud.soundcloudicon .soundcloudwhite {
    display: none;
    position: absolute;
    top: 0px;
    left: 0;
    z-index: 99;
}

<center><a href="https://www.instagram.com/thetrapparty/" target="_blank"><div class="instagram"><div class="instagramicon">

<center><img src="https://www.trapparty.net/wp-content/followicons/instagram.png" height="263" width="178" alt="instagram">
        </center>
<center><img src="https://www.trapparty.net/wp-content/followicons/instagramwhite.png" height="263" width="178"  class="instagramwhite" alt="instagramwhite"></center>
    </div>
<div class="igcount"><h2><center><font color="white">47.4k</font></center></h2></div>
<div class="followerstextig">Followers</div></div></a></center>

il risultato reale che vorrei può essere visto nel link Radar Label sopra, ma essenzialmente, Voglio che l’icona bianca per presentarsi ogni volta che mi librio sopra l’intero elemento div esterno.

EN From: How can I get an image inside another div element to react on hover on the outermost div element?

More similar articles:

2 Comments

  1. leggendo il titolo sarebbe qualcosa come:

    div img {
      border: 1px solid black;
    }
    
    div:hover img {
      border: 1px solid red;
    }
    1. non sono sicuro che capisco come questo risolve il problema. forse si può espandere i vostri pensieri? grazie per la risposta!

Leave a Reply

Your email address will not be published. Required fields are marked *