|
Open New Window
When you place a link on your page, users often move on to that page and don't return
to yours! This opens a second window with the new URL in it so that after that window
is closed, they are still on your site. When you test this demo, be sure to view the
source code and read the note on a second method of handling link clicks.
Change Picture
This is the script that changes from one picture to another when the mouse is moved
over the image, most commonly used to show buttons appearing to depress. The code
demonstrates pic1.gif and pic2.gif (not provided) which load when the page is loaded;
when the mouse is placed over them, pic1a.gif and pic2a.gif display in their place.
Substitute your own images for these when you run the code.
Writing to the Document
There are far too many ways to use Javascript to write to the document to
demonstrate them all here, so we've provided an example of how simple and
compound strings can be constructed to dynamically write to your page. You
can also use the output of any Javascript function, such as Date() (see below,)
to write to the document.
Close Window Button
When you've opened a second window, such as a help window, the user might not
realize that they need only to close the window to return to their previous
place on your site. This script reacts to a button to close the current window.
Be sure you run it from a second browser window, either by the
Open Window function above or by opening an new
browser window. Otherwise your browser will quit, being the only open
window(but at least you'll know it works!)
Browser Identification
Has anyone ever emailed you that your page is "messed up," only
to find they're using an older browser that doesn't support frames or
Java applets? This snippet identifies Netscape and Internet Explorer browsers and
tests them for versions 4.0 or higher. To identify other browsers or to get a more accurate
version determination requires a longer script which can be found in Netscape's Developer website,
DevEdge Online.
Collect User Input
This actually does several things, but the core of this scriptlet is to
collect three items of information from the user and use them to display a
witty (or corny) output on the page. This is one of the functions that you might want
to use judiciously-- not many users like to type in information just to see your site!
Print the Current Date/Time
There are literally hundreds of uses for Javascript's date object, from creating a
unique user ID to setting expiration timers, and there are even more ways to
output date data. This is a simple demo that dissects the string returned
from the new Date() function so that you can figure out how to print just the parts
you want and in whatever format you like.
Create Status Bar Messages on MouseOver of a Link
You can create supplemental messages in the status bar when the user places
their mouse over a link or other object. If you really want to get fancy,
you can also make it scroll (see below.)
Create Scrolling Status Bar Text
If it moves, it's likely to attract attention. :) This is another way to
create movement on your site without adding to download time; create a
scrolling text in the status bar.
Too Large for Display
These are larger or multiple HTML files that are far too complicated to
copy and paste, so we've zipped them up for download. Select the display links
to view what they do.
Online Calculator
This will fit nicely in a frame if your site involves a need for a calculator.
An attractive button interface, you won't know the difference from the real thing!
Online Estimating System
A trimmed-down version of our interactive
Site Design Estimating system, this version is identical except it cannot
submit the data when the estimate is complete (this involves a CGI script.)
This script involves cross-frame communication and a help system that
dynamically updates frames as the user selects field elements.
Color Picker
We picked this script up while learning Javascript and added a few
of our own features. :) It will soon appear as part of our
Online Formaker. It also involves cross-frame communication and
interactivity.
| 
