Changing images with jquery

by oterox

HTML

<div><img src='http://www.kriesi.at/themes/angular/files/2012/01/happy-465x346.jpg' /></div>

CSS

div {
    background: url('http://www.kriesi.at/themes/angular/files/2012/01/abstra-465x346.jpg');
    background-repeat: no-repeat;
}

JavaScript

$('img').hover(function() {
    $(this).animate({
        opacity: 0
    }, 500);
}, function() {
    $(this).animate({
        opacity: 1
    }, 500);
});