Seeking assistance for an issue I am facing. I am trying to change an image upon clicking on it. It works smoothly without any animation, but when I add animations, the transition becomes jerky.
<script>
$("#thumbs img").click(function() {
$("#mainImage").attr('src',$(this).attr('src').replace('thumbnails','ovado').replace('png','jpg'));
})
</script>
Adding an animation script causes the same image to load every time. Please take a look at the code below and provide assistance if possible.
<script>
$("#thumbs img").click(function() {
$("#mainImage").fadeOut(1000, function() {
$("#mainImage").attr('src',$('#thumbs img').attr('src').replace('thumbnails','ovado').replace('png','jpg'));
}).fadeIn(1000);
return false;
});
</script>