Как я могу переключать / анимировать <div>, наводя на <a>S - PullRequest
Новая
       0

Как я могу переключать / анимировать <div>, наводя на <a>S

0 голосов
/ 14 января 2020

Итак. У меня есть объект. Если я наведите на него курсор, я хочу переключить анимацию или просто css изменение div ниже.

Я хочу использовать только HTML & CSS no Javascript или что-то.

Вы можете найти структуру в разделе "код".

Спасибо за вашу помощь:) 

<body>
 <div>
  <a ← THIS IS THE OVER OBJECT>
  <div ← THIS IS THE DIV I WANNA ANIMATE>
   stuff
  </div>
 </div>
</body>

Ответы [ 2 ]

2 голосов
/ 14 января 2020

Вы можете использовать соседний селектор брата (обратите внимание, что div в этом случае должен следовать сразу за a): 

a:hover + div { background: blue } /* this is all that really matters */
<a href='#'>HOVER ME</a>
<div>I AM A DIV</div>

Если есть еще один элемент между a и div, но они все еще являются братьями и сестрами, вам нужно использовать ~ вместо +.

0 голосов
/ 14 января 2020

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

    a:hover div{
      //Animation code here
    }
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...