Hover in another image or background

-1

People can hover in another example image

It's not official anymore, it's like this:

<div class='blabla'>
<center><img class='bleble' src='imagem1.jpg'/></center>
<br/>
<a href='/'><img class='blibli' src='imagem2.jpg'/></a> - <a href='/'><img class='bloblo' src='imagem3.jpg'/></a>
<br/><br/>
</div>

When you hover over image 2 and 3 you change image 1 to a supposed image 4, remembering that image 1 may be in the background as long as you change it when you mouse 2 or 3. In html or javascript I wanted to know if you have how to do

    
asked by anonymous 07.06.2017 / 20:14

1 answer

0

You can do this:

$('.blibli,.bloblo').on('mouseover', function() {
  $('.bleble').prop('src', 'https://blognumbers.files.wordpress.com/2010/09/4.jpg');
});

$('.blibli,.bloblo').on('mouseout', function() {
  $('.bleble').prop('src', 'https://blognumbers.files.wordpress.com/2010/09/1.jpg');
});
img {
  width: 10%;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><divclass='blabla'><center><imgclass='bleble'src='https://blognumbers.files.wordpress.com/2010/09/1.jpg'/></center><br/><ahref='/'><imgclass='blibli'src='https://blognumbers.files.wordpress.com/2010/09/2.jpg'/></a>-<ahref='/'><imgclass='bloblo'src='https://blognumbers.files.wordpress.com/2010/09/3.jpg'/></a><br/><br/></div>
07.06.2017 / 20:38