|
Dear
Friend,
Hello
& welcome back to Firewire,
your friendly guide to the exciting world of web-design &
web-solutions!
We
receive lots of requests from the users/newsletter subscribers
to explain how to give the mouse over effect if they are creating
the home page using Adobe Photoshop. In this Newsletter we
are covering step by step guide on creating the mouse over
effect after slicing & optimizing the layout using Adobe
Image Ready.
NOTE:
To make the tutorial practical & easy to understand we
have created a Layout in Photoshop & Converted into HTML
format. Click
here to download the layout.
After downloading the layout follow
the below mentioned steps:
Open
the Layout in Photoshop
If
the Rulers are not visible, choose View
> Show Rulers
Remember
the following steps before setting the Guides:
1.
Keep separate Guides for each button
or the image to which the mouse over effect has to be given.
2.
Create separate layers
for each mouse over in Adobe Photoshop and hide the layers.
3.
Set the Guides accordingly
and save the file
4.
Choose File > Jump
to > Adobe ImageReady
If
the tool palette is not visible, Choose
Window > Show Tools.
Select
Slice Tool from the Tool Palette
After
selecting the slice tool , Drag the
slice tool to create a slice.
Follow
the steps given above to slice the whole layout according to
guides you have set.
|
