Всё работает:
<style>
div {
width: 250px;
height: 200px;
}
.bubble {
background: url('http://www.reekielum.com/backgrounds/bubble.jpg')
}
.wood {
background: url('http://www.nickfassolas.com/blog/images/Wood01.jpg')
}
</style>
<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
<script type="text/javascript">
hiddenImg= new Image();
hiddenImg.src= "http://www.nickfassolas.com/blog/images/Wood01.jpg";
$(function(){
$('div').mouseover(function(){
$(this).removeClass('bubble').addClass('wood');
}).mouseout(function(){
$(this).removeClass('wood').addClass('bubble');
});
});
</script>
<div class=bubble></div>