Show many images on asp.net page as thumbnails - asp.net

Question

I have saved images uploaded by user in one of my folders.In the sql server DB I just save the file-name of the image. For one item I have nearly 5-6 images. So I have an itemID as one of the column and imagename as one column and i have 1 2 3 4 5 in the table.
I need to display all these images in thumbnail format on a page. Like on craigslist. How do i proceed?

Answer 1

You can use javascript/jQuery image box to display a large image with small thumbnails.
Here are the two I know -
FancyBox (I'm currently using)
LightBox
Or You can use the following code -
Demo at jsfiddle
<style type="text/css">
.container img {
width: 100px;
}
</style>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script>
$(document).ready(function () {
$(".container img").mouseover(function () {
$("#<%= LargeImage.ClientID %>").attr("src", $(this).prop('src'));
}).mouseout(function () {
$("#<%= LargeImage.ClientID %>").attr("src",
"http://placehold.it/400x400&text=Image1");
});
});
</script>
<asp:Image ID="LargeImage" ImageUrl="http://placehold.it/400x400&text=Image1"
runat="server" />
<div class="container">
<asp:Image ID="Image1" ImageUrl="http://placehold.it/400x400&text=Image2"
runat="server" />
<asp:Image ID="Image2" ImageUrl="http://placehold.it/400x400&text=Image3"
runat="server" />
<asp:Image ID="Image3" ImageUrl="http://placehold.it/400x400&text=Image4"
runat="server" />
<asp:Image ID="Image4" ImageUrl="http://placehold.it/400x400&text=Image5"
runat="server" />
</div>