To read the article online, visit http://www.4GuysFromRolla.com/webtech/052400-1.shtml

Serving Dynamic Images from Static Web Pages


There are several times where it is nice to be able to serve a dynamic image from a static Web page. Dynamic images are those images that change often. For example, advertising banner rotation systems need to randomly select a single banner from a list of potential banners, and then dynamically display the selected banner when a page is requested. This is rather simple to do with the Ad Rotator. The drawback, however, is that the Ad Rotator can only be used on dynamic Web pages (ASP pages)!

This constraint is indeed limiting, since oftentimes a Web site will be comprised of both dynamic and static Web pages and it may be the desire of the Web master to have banner advertisements appear on all pages, both static and dynamic. We can overcome this constraint, however, with a little creativity.

To achieve this feat, first create an ASP page that is responsible for choosing what dynamic image needs to be displayed. Perhaps we wish to display a "Picture of the Day." Assume that we have a directory named /PictureOfTheDay that contains a number of pictures in the format YYYYMMDD.gif, each representing a picture for a particular day. For example, May 25th, 2000's "Picture of the Day" would be represented by the file: /PictureOfTheDay/20000525.gif. Assume that this ASP page, which is responsible for selecting what picture to display, is named /scripts/ShowPictureOfTheDay.asp.

Note that this ASP page that is responsible for displaying a dynamic image could perform any type of processing. For example, if we wanted to show a random picture from a directory of pictures, we could use the FileSystemObject to randomly select an image. (For a more detailed discussion of performing this task, be sure to read Displaying Pictures Randomly.)

The code for selecting the proper filename for the "Picture of the Day" is quite simple, and can be seen below:

<% @LANGUAGE="VBScript" %>
<% Option Explicit %>
<%
  'The filename of the Picture of the Day
  Dim strFileName
  strFileName = "/PictureOfTheDay/" & Year(Date())

  If Month(Date()) < 10 then
    strFileName = strFileName & "0" & Month(Date())
  Else
    strFileName = strFileName & Month(Date())
  End If

  If Day(Date()) < 10 then
    strFileName = strFileName & "0" & Day(Date())
  Else
    strFileName = strFileName & Day(Date())
  End If

  strFileName = strFileName & ".gif"

  Response.Redirect strFileName
%>

Note the Response.Redirect to the filename as the last line of code in /scripts/ShowPictureOfTheDay.asp. Whatever image you need to dynamically display (be it a banner ad, a "Picture of the Day," or a random image), you will always want a Response.Redirect at the end pointing to the image to display.

Now, to display this dynamic "Picture of the Day" image from any page (either a static or dynamic page), simply use the IMG HTML tag like so:

<IMG SRC="/scripts/ShowPictureOfTheDay.asp">

That's all there is to it! Now your dynamically-selected images can be displayed on both ASP and HTML pages. Sites like 15Seconds.com, which strive to maximize performance through static pages but need to serve dynamic banner advertisements, rely on this method.

Happy Programming!


Attachments:

  • Try out a live demo!


  • Article Information
    Article Title: Serving Dynamic Images from Static Web Pages
    Article Author: Scott Mitchell
    Published Date: Wednesday, May 24, 2000
    Article URL: http://www.4GuysFromRolla.com/webtech/052400-1.shtml


    Copyright 2017 QuinStreet Inc. All Rights Reserved.
    Legal Notices, Licensing, Permissions, Privacy Policy.
    Advertise | Newsletters | E-mail Offers