Adobe photoshop cs2 Manual Do Utilizador
604
Chapter 21: Rollovers and animations
Rollovers
About rollovers (ImageReady)
A rollover is a button or image on a web page that changes when a viewer moves the pointer over it or clicks it. The
button itself can change or another item on the page, such as a photo or list of menu items, may appear. A remote
rollover triggers a change in a web page element other than the button or image being rolled over.
button itself can change or another item on the page, such as a photo or list of menu items, may appear. A remote
rollover triggers a change in a web page element other than the button or image being rolled over.
To create a rollover, you define the rollover image as a layer-based slice or a layer-based image map. Then you work
with the Web Content palette and the Layers palette in ImageReady, doing any of the following to create different
versions of the graphic:
with the Web Content palette and the Layers palette in ImageReady, doing any of the following to create different
versions of the graphic:
•
Modify the contents of a layer by adding or changing a layer style or moving layer contents.
•
Replace the contents of an image with a new layer.
•
Replace the contents of a layer elsewhere on the page.
•
Add frames to create a rollover animation.
Alternatively, you can apply one of the preset rollover styles from the Styles palette to an image layer. Rollover styles
are a quick and easy way to create rollovers or to reuse a rollover you’ve create with other graphics. See “To copy and
paste rollover states (ImageReady)” on page 612.
are a quick and easy way to create rollovers or to reuse a rollover you’ve create with other graphics. See “To copy and
paste rollover states (ImageReady)” on page 612.
Rollover states
Every rollover has two or more states that you create and manage in the Web Content palette. A state is defined by a
specific configuration of the Layers palette, including layer location, styles, and other formatting options.
specific configuration of the Layers palette, including layer location, styles, and other formatting options.
A
B
C
An image with three rollover states
A. Normal state B. Over state C. Down state
A. Normal state B. Over state C. Down state
By default, an image has one state—the Normal state. The Normal state corresponds to the appearance of an image
when it is first loaded into a web browser and no rollover effects have occurred. You can add image states that occur
when a viewer performs a mouse action—such as rolling over or clicking over an area of the web page.
when it is first loaded into a web browser and no rollover effects have occurred. You can add image states that occur
when a viewer performs a mouse action—such as rolling over or clicking over an area of the web page.
Using layers
When you add a new state to the image, you capture a snapshot of the slice or image map area in the previous state.
You can then use the Layers palette to make changes to the image in the new state. You can change the layer’s style,
visibility, and position to create rollover effects.
You can then use the Layers palette to make changes to the image in the new state. You can change the layer’s style,
visibility, and position to create rollover effects.