WillMaster Possibillites Logo EzineSeek Award
Quick! Click the Button!
by
William "Will" Bontrager

Permission is granted to reprint this article in its entirety, provided no reprints are sent in conjunction with unsolicited bulk email, provided no fee or other value is exchanged, provided no changes are made to the article, and provided the author's name, signature lines, and copyright line are printed with the article; except you may change the article's title.

A reader suggested an article about popup windows that stay open for only a predetermined number of seconds. The idea was that a special could be offered in the popup that must be taken advantage of before the popup closes.

Several days later, another reader asked for a bit of help installing something similar.

Okay, here's the WillMaster way to do it :)

  1. A cookie is set when the popup is launched so it is displayed only once.
     
  2. You determine how long the cookie lives on the prospects computer, from 0 days (which means the cookie will delete when the browser is closed) to 3652 days (10 years).
     
  3. You determine how many seconds the popup will be visible before the window closes automatically.
     
  4. You can customize a JavaScript function to do anything (or nothing) every time a second of time elapses. The example displays countdown numbers in a form field.

http://willmaster.com/a/10/pl.pl?art107 is the example implementation. It stores a cookie on your hard drive that will delete when you close your browser. The popup stays up for 30 seconds.

The example page also has a link to download the ZIPed set of the example pages.

You can use this code to:

  1. Display immediately pertinent information in a popup window that will close itself after a specified number of seconds (provided the visitor hasn't already closed the window).
     
  2. Offer a special price if taken advantage of within the specified number of seconds.
     
  3. Any situation where you want to create a sense of urgency and/or effectively demand immediate action.

Instructions for the Page that Launches the Popup

In the JavaScript source code, you'll find places to specify:

  • The URL of the popup window's HTML page.
     
  • The height and width of the popup window, and whether or not is may be resizable and/or have scrollbars.
     
  • The number of days the cookie shall live on the visitor's computer.

You also have choice of when the popup window shall launch.

The example launches the popup window when the page first loads. That is accomplished by putting

onLoad="LaunchPopUp()"

in the BODY tag. If you prefer to launch the popup window when the visitor leaves the page, put

onUnload="LaunchPopUp()"

in the BODY tag, instead. To launch the popup window a certain number of seconds after the page is loaded, use

onLoad="SetTimeout('LaunchPopUp()',10000)"

in the BODY tag. (The 10000 is the number of milliseconds, 10 seconds, to delay before launching the popup window.)

If you prefer not to launch the popup window automatically, you can use a clickable link similar to:

<a href="javascript:LaunchPopUp()">
Click for one-time offer, 
good for only 30 seconds after clicking!
</a>

Instructions for the Popup's Page

In the JavaScript source code, you'll find places to specify:

  • At what number the countdown shall begin. That will be the maximum number of seconds the popup window can exist.
     
  • Optionally, you may modify the function that currently displays the counting down numbers in a form field. The function can do anything, display large graphical numbers representing the number of seconds left, for example. The function can even be made to do nothing.

As in the example, the BODY tag must contain:

onLoad="StartTheCounter()"

Without the above, the counter doesn't start. The BODY tag may also contain

onBlur="self.focus()

so the popup window will remain in focus until it is closed.

The popup window may contain anything you want. If you want the countdown numbers in the form field, like in the example, you must have a form name="time" with a name="timeleft" field. The form may contain other fields, too, if you wish.

If the popup window is a call for action, a button or link must be provided. If the action includes displaying another page, you can launch a new window by putting

onClick="window.open('http://domain.com/')"

into a type="button" or type="submit" input tag. For a text (or image) link, it would be something like this:

<a href="http://domain.com/" target="_blank">Click Here</a>

There you have it; a complete kit :)

Copyright 2001 William Bontrager
Programmer/Publisher, "WillMaster Possibilities" ezine
http://willmaster.com/possibilities/
subscribe-possibilities@willmaster.com
Business Home Page: http://willmaster.com/