./paulOr

I'm currently making a site which requires a rollover on an image that will show the images name and a description in a div which appears on hover.

Heres how I've done it.

<!-- JQUERY FROM GOOGLE AND JS UNDER IT -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script>
$(document).ready(function() {
	$(".image_slide").hover(
		function() { $(this).children('.slide_info').show(); },
		function() { $(this).children('.slide_info').hide(); }
	);
});
</script>

<!-- HIDE BY DEFAULT WITH CSS :] -->
<style>
.slide_info {
	display: none;
}
</style>

<!-- HTML ELEMENTS -->
<div class="image_slide">
	Image
	<span class="slide_info">Image info & Description</span>  
</div>
<div class="image_slide">
	Image
	<span class="slide_info">Image info & Description</span>  
</div>
<div class="image_slide">
	Image
	<span class="slide_info">Image info & Description</span>  
</div>