Как я могу получить изображение внутри другого элемента div, чтобы реагировать на наведение на самый внешний элемент div? - PullRequest
Новая
       8

Как я могу получить изображение внутри другого элемента div, чтобы реагировать на наведение на самый внешний элемент div?

0 голосов
/ 02 июня 2019

У меня есть страница, на которой у меня есть плагин Wordpress, использующий HTML для отображения некоторой информации, которую я извлекаю с разных сайтов (importXML).Идея состоит в том, чтобы страница выглядела примерно так https://www.labelradar.com/labels/chillyourmind/profile,, чтобы при наведении на определенный элемент весь элемент реагировал и превращался в белый логотип с основным цветом значка социальных сетей.В настоящее время я могу заставить работать весь CSS, кроме одной маленькой детали, и это белый значок.Он меняется только в том случае, если вы находитесь в пределах досягаемости контура изображения значка.

Вот эта страница: https://trapparty.net/theparty/

Я знаю, что должно быть что-то, чтобы заставить div реагировать так жевремя, когда я парю над внешним элементом div, контролирующим все это.Вот набор всего CSS-кода, который я использую:

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

А ниже приведен один элемент HTML со вложенными элементами DIV.

Я пробовалкомбинируя некоторые CSS, как это, чтобы попытаться вызвать div снаружи: 

.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>

Фактический результат, который я хотел бы увидеть, можно увидеть в ссылке Label Radar выше, но, по сути, я хочу, чтобы белый значокпоявляются всякий раз, когда я наводю курсор на весь внешний элемент div.

1 Ответ

0 голосов
/ 02 июня 2019

Читая заголовок, это будет что-то вроде: 

div img {
  border: 1px solid black;
}

div:hover img {
  border: 1px solid red;
}
...