немножко с jquery из-за анимаций
<div style="border:1px red dashed; padding:4px; position:absolute;">
<img src="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif" to="http://javascript.ru/img/webstorm.png">
</div>
<script src="http://yandex.st/jquery/1.6.4/jquery.min.js"></script>
<script>
var timer;
$("div").hover( function(){
var img = $("img", this);
timer = setTimeout(function(){
img.fadeOut("slow",function(){
img.attr('src', img.attr("to") ).fadeIn();
});
}, 5*1000);
}, function(){
clearTimeout( timer );
});
</script>