Example Scripts Index
- Date Selection Pop-up Calendar (June 2004).
- By popular demand (sort of), a cross-browser pop-up calendar
(in-window) for the quick entering of dates into form fields using
a mouse (or other pointing device).
- Dynamic Drop Down Menu (October 2004).
- Drop-down navigation menu scripts are rarely flexible enough to adapt
to user preferences for window dimensions and font-size, or capable
of clean-degradation to viable HTML alternatives. This script attempts
to demonstrate that neither are consequences of the nature of drop-down
navigation menus.
- Dependent (or Cascading) Select List (January 2003).
- Dependent Select List is one of those scripts in which the selection
in one HTML select element changes the options in the next. It allows an
indefinite sequence of such lists to be chained together and has been
designed to leave a workable UI in the event that client-side scripting
is unavailable (or the browser cannot support the script). On the whole
I found the results unsatisfactory and would prefer to cope with
JavaScript disabled browsers by splitting the dependent lists up
across a sequence of pages in a wizard style interface, having
server-side scripts write out the options of the next list based on
the values from the previous page. However, this script is still better
than most of the others of its type that I have seen.
- Finalizer. (May 2003)
- Finalizer is a general function designed to arrange that a function
passed to it as an argument is executed during the onunload event in a
browser. Its primary purpose is to address the memory leak problem on
IE browsers but has been written to provide the facility cross-browser
as it may have other applications.
- In-Window Image pop-up. (December 2003)
- A recurring theme in browser scripting is the desire to use a gallery
of thumbnail images as the launching point of a series of new windows
pre-sized to fit the larger versions of those images. Unfortunately it
is not achievable cross-browser, not least because any operation that
involves new windows is subject to the influence of pop-up blocking
software, but also because determining the required size for the new
window can, at best, only be done based on invalid assumptions about user
configurable and OS dependent window features. This script demonstrates an
alternative approach that avoids the need to open new windows and the
reliance on invalid assumptions.
- In-Window pop-ups. (May 2004)
- What started life as a fairly simple script demonstrating dragging
multiple in-window pop-ups and adding z-index control in the form of a
simple window manager expanded into quite an elaborate window manager with
re-sizable, scrolling, dragable windows with most of the possible window
features added to a basic window object by augmentation, making the result
fairly modular.
- Falling Snow (May 2004).
- Another of those irritating DHTML animations that people seem to like
to add to web sites on a seasonal basis.
- Star Field 1. Demo and Source (August 2003).
- This script is a re-working of a "travelling through space"
visual effect. It was written in response to a comp.lang.javascript question
complaining that Gecko browsers would not run another example of this script
quickly enough for the result to be a smooth animation. It has been my
experience that Gecko browses are capable of executing most animation
scripts successfully, but only if they are written for maximum efficiency.
- I re-worked the original script, though nothing of that original remains
in this version (so I won't credit its author) and achieved satisfactory
results on Gecko browsers. This version cheats when producing the 3D
illusion and the result produces a fish-eye lens like effect, which I
actually prefer to the following version.
- Star Field 2. Demo and Source (August 2003).
- The fish-eye lens effect of the previous star field script did not meet
with universal approval so I re-wrote it again. This version models the
stars in a virtual 3D space and then applies a perspective transformation
to project them onto the browser viewport. I originally thought that it
would not be practical to do the perspective transformation quickly enough
to achieve smooth animation but applying a number of short-cuts, such as
only modelling one quarter of the 3D space and then randomly projecting the
stars onto the rest of the viewport, produced an acceptable final result.
- Both this script and the preceding star field script may be of interest
in that they demonstrate a (almost) totally anonymous script. That means that
they have no impact on the global namespace and cannot be interacted with by
any other scripts on the same page. They are only almost anonymous because
they use the
setTimeout function and employ the fall back
technique of providing custom toString functions for the
function that are passed as references to setTimeout so that
they can still work on browsers that cannot accept non-string parameters
as the first argument to setTimeout (such as IE 4 and Opera 5).
If the browser has to use the fallback it must create a global property so
that the setTimeout function can resolve its string argument.
- Table Highlighter. (July 2003).
- Highlighting table rows and columns when the mouse is over them is
relatively trivial but becomes more involved when some of the cells in
the table use rowspan or colspan attributes. These scripts were designed
to totally automate the process of determining the relationship between
rows and columns and spanning cells. Resulting in a script that is
extremely easy to configure and use. The original
row and column highlighting version
was easily adapted to a row only
and column only highlighting
version.
- Table Body Scroller. (July 2004).
- A script that scrolls the body of a table while keeping the header
cells visible and lined up with their respective columns and rows.
- Table Body Scroller, with cell content automatically offset. (September 2004).
- A variation on the preceding script that attempts to keep as much
of the contents of the scrolling table in the region visible to the
user as possible.
- Table Sorter. Demo and Source (June 2003).
- Table Sorter is a W3C DOM table sorting script designed to be fast,
degrade cleanly and silently on un-supporting browsers and facilitate
fall-back to server-side table sorting if the task cannot be done on the
client.
© Richard Cornford 2004