Make Simple Rollover Using Imageready 3.0
SITE DESIGN TIPS
This tutorial assumes that you know how to create the button (using Photoshop 6.0) that we will be “rolling over.” I will show you how to create a new layer using ImageReady 3.0, and how you want the button to look when the mouse rolls over it.
Difficulty Level = 1 – 2 – 3 – 4 – 5
(Novice)
1. Check how the rollover will look before and after by simply turning on and off the top layer in Photoshop.SITE DESIGN TIPS
This tutorial assumes that you know how to create the button (using Photoshop 6.0) that we will be “rolling over.” I will show you how to create a new layer using ImageReady 3.0, and how you want the button to look when the mouse rolls over it.
Difficulty Level = 1 – 2 – 3 – 4 – 5
(Novice)
1. Check how the rollover will look before and after by simply turning on and off the top layer in Photoshop. We now have the images ready. Time to make them into rollovers in ImageReady.
2. Launch the ImageReady, (File>Jump to>Adobe ImageReady 3.0), or by simply clicking on the button at the bottom of the tools palette. ImageReady will launch with your layers intact.
3. Go to the rollover palette. Make sure the top layer is hidden and your “normal state” (how it looks before the mouse rolls over it) will be set.
4. Click on the “new state” button and the “over state” is created. This will appear on the webpage when the mouse moves over the image. Change its appearance by making the top layer visable. Each state will reflect what is visable in the layers palette.
5. Now click on the slice tab and add a URL to your rollover. A URL is where you want the link to take you. If it’s a different site, make sure that you use a http:// address. This step is optional. You will be able to add the URL that you need later using DreamWeaver or some other HTML editor that you like.
6. You can test your rollover by clicking the test button on the tool palette. When you are sure that you have made the rollover effect work properly, select File>Save Optimized, give your page a name and create a folder where ImageReady will save graphic files. Then select Output setting>Saving files, and ImageReady will do all the work for you including creating the HTML page.
Galina is the designer for Gold-AVS-Design.com. Gold-AVS-Design offers quality design for your adult sites for a very reasonable price. For more information please visit http://www.gold-avs-design.com or email contact@gold-avs-design.com.
function changeImages() { if (document.images) { for (var i=0; i