By: William "Will" Bontrager, Programmer & Publisher
Copyright 2001 William Bontrager
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 :)
- A cookie is set when the popup is launched so it
is displayed only once.
- 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).
- You determine how many seconds the popup
will be visible before the window closes
automatically.
- 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:
- 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).
- Offer a special price if taken advantage of within
the specified number of seconds.
- 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:
Click for one-time offer,
good for only 30 seconds after clicking!
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.
he 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:
Click Here
There you have it; a complete kit :)
William Bontrager
Programmer/Publisher,
"WillMaster Possibilities" ezine
http://willmaster.com/possibilities/
subscribe-possibilities@willmaster.com
Business Home Page: http://willmaster.com/