Giving Hover one element and changing the other is not working

Asked

Viewed 72 times

0

I looked for all the ways to give hover one element and change another and some of them already knew and had tried but it wasn’t working, so I went looking for others and I tried everything #example:hover + #change, #example:hover ~ #change, #example:hover #change, etc but none of them worked. So I went for the easiest solution, jQuery, but he was bugging out when he applied the effects, sometimes applied other times not, tried to follow up with the normal css again. But I found no way!

HTML:

<div class="section">
     <img id="thumbnail" src="img.png">
     <h2 id="title"><center><span>Some title</span></center><h2>
</div>

CSS:

#thumbnail:hover #title {
    font-size: 30px;
}
  • Do you want to hide the image by clicking a button? I’m in doubt, explain it to me better

  • @Planetwar you read and saw the code? I’m trying to give Hover in img and change the #title '-'

  • I get it, one moment I’ll make the code

1 answer

1


I did it in pure Js and it worked, but it is much more feasible to do it in pure css

You did it right, you just had to put one "+"

#title {
    font-size: 100px;
}

#imagem:hover + #title {
    font-size: 10px
}
<img id="imagem" src="https://cdn.sstatic.net/Sites/stackoverflow/img/[email protected]" width="50" height"50">

<div id="title">Some title</div>

Browser other questions tagged

You are not signed in. Login or sign up in order to post.