jQuery Button Fade

#background {
	background-image: url(background.jpg);
	background-position: center;
	background-repeat: no-repeat;
	min-height:422px;
	min-width:308px;
	height: inherit;
}
 
.button {
	z-index: 100;
}
 
img.dlon {
	position: fixed;
	z-index: 10;
	cursor:pointer;
    }
 
img.dloff {
	position: fixed;
	float: right;
	margin-top: 100px;
	}
 
//Button fade jquery
$(document).ready(function(){
 
$("img.dlon").hover(
function() {
$(this).stop().animate({"opacity": "0"}, "fast");
$("img.free").fadeIn().animate({"opacity": "0"}, "fast");
},
function() {
$(this).stop().animate({"opacity": "1"}, "fast");
$("img.free").stop().animate({"opacity": "1"}, "fast");
});
 
});
 
<div id="background" > 
 
    <div id="background.button"> 
        <a id="clickableArea"> 
        <img width=340 height=72 border=0 alt="Download Toolbar!" src="button_on.jpg" class="dloff"></a> 
        <a id="downloadNow" href="http://some_url"> 
        <img width=340 height=72 border=0 alt="Download Toolbar!" src="button_off.jpg" class="dlon"></a> 
    </div> 
 
</div>