Please Read
1. Please do not edit or redistribute this tutorial. We take our time to make these and would like credit for them.
2. A link back to Saruna.Net is required. Our buttons are located on the "Site" navigation.
This tutorial is written by:Liz

Open up your image, the one you want to use rollovers on.

Create a new layer making the part that you want to show up once people hover over the image. I'm using the layer on the side.
On your layers palatte, you should only have two layers. Your original layer and the layer to hover. Now, on your layer to hover, make sure to click on the eye so that layer is not visible anymore. Now, jump to imageready by clicking on this icon below your tool palatte: .

You should now be in Adobe ImageReady. Click on [Window >> Make sure Web Content is checked] On your web content settings, on the right side, click on the create layer based rollover icon which looks like this: .

On your Rollover States, a layer called Over should show there. Make sure that one is highlighted.
Make the hover layer you made invisible, by clicking on the eye, visible again. How? Click on the blank space where the eye goes.

You're almost there ;D Now, click on the Internet Explorer tool icon you see there. You will now be taken to an internet page where you can preview your rollover. Hover over it to test it out. Once you do that, copy the code below and paste it on your web site! You are now done!! =D

But wait! Don't forget to save it!! [File >> Save Optimized As] Name your images and click ok. Make sure to upload the whole folder/files on your site.

Hover Me!!! XD