I'm woking on a simple image replacement thumbnail gallery using jQuery and am trying to get each image to fadeIn when the thumbnail is clicked. My (stripped down) code looks like this so far:
<head>
<script>
$(document).ready(function(){
$(".thumbs a").click(function(){
var largePath = $(this).attr("href");
var largeAlt = $(this).attr("title");
$("#largeImg").attr({ src: largePath, alt: largeAlt });
return false;
});
});
</script>
</head>
<body>
<img id="largeImg" src="img1-lg.jpg" alt="Large image" />
<p class="thumbs">
<a href="img1-lg.jpg"><img src="img1-thumb.gif" /></a>
<a href="img2-lg.jpg"><img src="img2-thumb.gif" /></a>
<a href="img3-lg.jpg"><img src="img3-thumb.gif" /></a>
</p>
</body>

Can anybody help me with this, or point me to a better solution? I'm trying to ditch my old staple--Flash (like Apple )--for overall end usability.

I'm trying not to use any jQuery plugins.

Just a heads up I'm a bit of a n00b with .js and jQuery.