Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS [Solved] Hover images Reply To: [Solved] Hover images

#171501
masterr
Participant

This is the only code that works partially. it only works on one image because when I try to add more than one, it doesn’t work.

#a,#b{
    float: left;
    border: 1px solid #000;
    padding: 0.2em;
}

img.second {
    display: none;
}

#a:hover + #b img.first {
    display: none;
}
#a:hover + #b img.second {
    display: inline-block;
}​
<div id="a">
    <img alt="img" src="images/img2.1.jpg" />
</div>

<div id="b">
    <img class="first" alt="img" src="images/img1.jpg" />
    <img alt="img" class="second" src="images/img2.jpg" />    
</div>​​​​​​​​​​​​​​​​​