- Streaming the Images
- Displaying Thumbnails
- Displaying Larger Versions of the Images
- Ready To Go?
Like this article? We recommend
Like this article? We recommend
Like this article? We recommend
Displaying Thumbnails
Instead of pasting an entire web page displaying images from the database, I'll show you some code you can add to any of your web pages, using C# as the script language to display images by using the code-behind script in Listing 1. The first thing you need to do is add the following line to the top of the web page:
<%@ Page Inherits="ImageResizing.MainDisplay" SRC="imagegen.aspx.cs"%>
This line tells the IIS web server that we'll be using C# as the script language for the page; it also loads the ImageResizing namespace from the code-behind script starting at the MainDisplay class (the only class in this namespace). The next part is a little tricky, as it sets up a pop-up window call to a larger version of the image, which I'll get to shortly. First, look at the code in Listing 2.
Listing 2 Setting up a link to display the larger image in a JavaScript pop-up window
<a href="imagegen.aspx?img=2&client=1&set=5" onClick="openCustomWindow();" target="client"> <img src="index.aspx?ImgID=2&height=98&width=67" alt="" border="0"> </a>
This is all one line and displays the image thumbnail. The page index.aspx (the page displaying the image) calls itself by passing the ID of the image inside the image tag (in this case, 2) to the code-behind script that's already set to execute and display the image because of the page-load function. Height and width are set to a thumbnail size, and the picture is scaled correctly to size without losing any resolution.
Notice that this image tag is nested inside an href tag; we're calling a Java function to open a pop-up window and execute a small script called imagegen.aspx. This very simple script uses the same code-behind as our index.aspx page uses. We pass the imagegen.aspx script the image ID and it passes it to the code-behind script. I'll show that next.