(1) (2) (3)
Scene from the classic movie, The Treasure of the
Sierra Madre.
EXT. Near gold mine
Fred C. Dobbs confronts the bandit nicknamed Gold
Hat.
DOBBS: Well, I think we need to see your JavaScript
before we'll let you do our Web site rollovers.
GOLD HAT
(grins through blackened teeth)
JavaScript? We ain't got no JavaScript. We don't need no JavaScript. I don't
have to know any stinking JavaScript to do Web site rollovers!
Okay, okay, the scene does actually plays a little
differently than that. But Gold Hat is right, using Photoshop
and Image Ready, we JavaScript deficient, blackened teeth Web
site designers do not need to know JavaScript to do image rollover
effects. Old Gold Hat shows you how it's done.
STEP 1
Okay, you stupid gringo Web designers this is what you have to do .... sorry
I got carried away. The first task is to create a simple column of buttons,
each on its own layer. In my case I created 4 buttons on a black background
(you can use any color or go transparent). Each button consists of two parts,
a white rectangle and some text. I save this file as buttons.psd.
 |
|
Original .PSD file
|
STEP 2
The next step is to slice the image up into 4 separate buttons. I select my
first rectangle shape layer (Layer 1 in the above example) and then go -
Layer - New Layer Based Slice. This creates a slice around the white rectangle.
I do the same for the other 3 buttons. As you can see by the example below
my image is now sliced into 11 different parts. My goal is to create rollovers
for slices, 03, 06, 08, and 10.
 |
|
Image sliced by layers
|
Now I save the file again. Then I must export the
file to Image Ready to create the rollover effects. Simply click
the icon at the bottom of the toolbar.
