My homepage has images in my posts and I have been using the following javascript according to this site (http://grepable.blogspot.sg/2013/01/modify-homepage-image-animation-in.html) to make my images fade out when I mouse over them and fade in when I move my mouse away:
<script type='text/javascript'>
$(function() {
$('.snips-image').hover(function() {
$(this).find('img').animate({
opacity: 0
}, {
queue: false,
duration: 400
});
}, function() {
$(this).find('img').animate({
top: '0px',
opacity: 1
}, {
queue: false,
duration: 400
});
});
})
</script>
It has always worked fine, but today I noticed that the javascript isn't working anymore and the animation is gone; the images are just static when I mouse over them. They look like this now (http:// mermaidwithabook .blogspot. com/ <--- please delete the spaces in between). How do I get the javascript to work like it did before? I don't know what went wrong. The images should fade out when you mouse over them just like on this site (http://grepable.blogspot.com/).
Help is greatly appreciated. Thank you!