|
Permission is granted to reprint the above article in its
entirety, provided no reprints are sent in conjunction with or related to any
unsolicited bulk email, 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.
|
Coding for JavaScript mouseovers used to be a
complicated, frustrating proposition.
Coding for double image rollovers was not for the
faint-hearted.
Double image rollovers are used at a some sites here
and there on the 'net. The technique changes two separate
images when a mouse cursor travels over an image link
somewhere else on the page.
With two images changing when the mouse travels over a
link elsewhere, it provides enough elements with which
to become quite creative.
Here are some ideas to get you started:
- You are at a site offering website creation
services. As your mouse travels over a "design"
link,
- a previously blank area of the page (it
had a blank image) suddenly sports an
image of money being cut in half with
a scissors, and
- an image in another area of the page
previously showing a serious face now
shows a happy, glowing face.
And when your mouse leaves the "design" link, the
two changeable images restore to their previous
state.
- A picture changes and a title changes as the mouse
travels over an image somewhere else on the page.
The demonstration/generation page uses that as an
example. (See URL below.)
- As the mouse travels over a navigation button,
a previous red spot on the page turns green and a
picture of the site owner is replaced with an icon
representing the destination of the navigation
button.
- You have navigation links surrounding an image.
When a mouse travels over one of the links, the
surrounded image changes and a balloon with text
appears above the group.
You might think such effects are only for the pros. Not so.
As of today, double image rollover mouseovers are easy.
How? With the generator at
http://willmaster.com/a/url.pl?double
Just type in the names of your graphics files, specify the
location of the two rollover images, and click the button.
Then, copy the generated code and paste it into your
web page.
That's all there's to it.
Oh, one more thing:
Happy mouse-over-ing!
Copyright 2000 by William and Mari Bontrager
William Bontrager, Programmer and Publisher
"Screaming Hot CGI" programs
"WillMaster Possibilities" e-Newsletter
http://willmaster.com/possibilities/
subscribe-possibilities@willmaster.com
| 
