Rollover animations are graphics that change as you pass the mouse over a specific spot onscreen. These animations are useful for emphasizing links, especially in graphics that might not be clearly marked. Rollovers consist of a normal state, mouse-over state, and click state, so this tutorial creates a separate image variation for each state. To explain the rollover effect, this tutorial creates a basic button and then changes the state of the button. After you create the button and its three states, you must save the HTML code as well as the graphics and then paste the code into the target web page.
Create a New ImageReady File
In ImageReady, select File, New to open the New Document dialog box so you can create a new file. For this tutorial, specify a width of 340 pixels and a height of 240 pixels for the image size; then select the White radio button. Click OK.