Hello All,

I have this peice of coding which simply swaps an image when a link is clicked, I also show some hidden html content which is positioned over the image.

 <script>
if($.browser.msie && parseInt($.browser.version) <= 6){
$('#contentone, #contenttwo, #contentthree, #contentfour, .linksBackground').hide();
}

$('#contentone, #contenttwo, #contentthree, #contentfour').hide();

$("#linkone").click(function() {
    $('#contenttwo, #contentthree, #contentfour').hide("1500");
    $("#imageone").attr("src","Resources/Images/TEMP-homeOne.jpg");
    $("#contentone").show("1500");
});
$("#linktwo").click(function() {
    $('#contentone, #contentthree, #contentfour').hide("1500");
    $("#imageone").attr("src","Resources/Images/TEMP-homeTwo.jpg");
    $("#contenttwo").show("1500");
});
$("#linkthree").click(function() {
    $('#contentone, #contenttwo, #contentfour').hide("1500");
    $("#imageone").attr("src","Resources/Images/TEMP-homeThree.jpg");
    $("#contentthree").show("1500");
});
$("#linkfour").click(function() {
    $('#contentone, #contenttwo, #contentthree').hide("1500");
    $("#imageone").attr("src","Resources/Images/TEMP-homeFour.jpg");
    $("#contentfour").show("1500");
});
</script>

Does anyone know how I can further modify this to show a small thumbnail image when the user rolls over the link?

I just need a hint because I'm not sure where to turn to... can I achieve it with mouseover?