Changing images on click?

Hello I was faced with this challenge, there is a block on the floor of the screen and menus at the top, when clicking on a link from the menu tightens at the url of the new image on the background block, the question is how this process is to animate but with the animation?

PS, can I somehow messed with the performance, so if anyone can advise an alternative solution I would be very grateful!

here's the menu!
<a href="javascript:l_image ('https://static.pexels.com/photos/353644/pexels-photo-353644.jpeg')">Elegance</a>
<a href="javascript:l_image ('https://static.pexels.com/photos/356433/pexels-photo-356433.jpeg')">Creation</a>
<a href="javascript:l_image ('https://static.pexels.com/photos/354249/pexels-photo-354249.jpeg')">Family Office</a>
<a href="javascript:l_image ('https://static.pexels.com/photos/593330/pexels-photo-593330.jpeg')">Experience</a>


here is the block where poset picture!
<div class="img-container"><img src="https://static.pexels.com/photos/593330/pexels-photo-593330.jpeg" name="example_img" alt></div>


but the script itself
function l_image (a) {
document.example_img.src=a
 }
June 14th 19 at 20:39
1 answer
June 14th 19 at 20:41
<a href="javascript:l_image ('https://static.pexels.com/photos/353644/pexels-photo-353644.jpeg')">Elegance</a>
a great example of*nocoda. Don't do that.

the url to your new picture on the background of the block

<img src="https://static.pexels.com/photos/593330/pexels-photo-593330.jpeg" name="example_img" alt>

where's the background? If just the image src to change that:

$('.menu_a').on('click',function(e){
e.preventDefault();
var imgurl = $(this).data('url');
$("#someimage").attr('src',imgurl);
})

HTML change this:

<a href="#" data-url="https://static.pexels.com/photos/353644/pexels-photo-353644.jpeg">Elegance</a>
<div class="img-container">
 <img src="https://static.pexels.com/photos/593330/pexels-photo-593330.jpeg" alt id="someimage">
</div>
All great works, thank you, and how to tie the animation correctly?? - rachelle_Wuckert commented on June 14th 19 at 20:44
and that to animate it? animation of what, replace one picture to another? One leaves another arrives? - lily.Kozey commented on June 14th 19 at 20:47
Well , in General, and so, the main thing that looked more alive - rachelle_Wuckert commented on June 14th 19 at 20:50

Find more questions by tags JavaScriptCSSjQuery