Post by Raw Metal on Dec 29, 2003 8:13:16 GMT
In this tutorial I'll show you how to create basic rollover buttons in PhotoShop and ImageReady.
1. Create a new file in PhotoShop and fill the background with whatever color you want. In this case I used black.
2. Add any text you would like your rollover to have. In my image I used "Home" with a white text color.
3. If you are going to add any kind of background effect, create a copy of your background by selecting your original background and dragging it to the "Create Layer" button.
4. Add whatever effect you would like to your background.
5. Select the "Jump to ImageReady" button to import your image to ImageReady.
6. When you get to ImageReady, please check to see if the Rollover window on the left is present. If it is not, go to Window->Show Rollovers.
7. Select the Rollover tab and select your current image. Then click at the bottom of the window "Create Rollover State" button.
8. Once you select that, user_01 and Over State should appear below the current image. Select Over State.
9. Go back to the layers window and select your background. If you haven't already done so, make a copy of your background and delete your old one.
10. Next, select the "F" button at the bottom of the Layers window.
11. A pop-up should come up with the different effects you can use. Choose the inner glow effect. Then go back to the Rollover window.
12. The Inner Glow tab should come up in the Rollover window and then change the color to white if you have black, or black if you have white, or maybe something that you like.
13. If you have to, to make sure it works, click the Preview Button to see it.
14. To save, go to Save-> Save Optimized As, then upload all the files it gives you, onto your host.
My finished work: www.geocities.com/staticday2002/Final.html
Let me know how I did on my first tut!
1. Create a new file in PhotoShop and fill the background with whatever color you want. In this case I used black.
2. Add any text you would like your rollover to have. In my image I used "Home" with a white text color.
3. If you are going to add any kind of background effect, create a copy of your background by selecting your original background and dragging it to the "Create Layer" button.
4. Add whatever effect you would like to your background.
5. Select the "Jump to ImageReady" button to import your image to ImageReady.
6. When you get to ImageReady, please check to see if the Rollover window on the left is present. If it is not, go to Window->Show Rollovers.
7. Select the Rollover tab and select your current image. Then click at the bottom of the window "Create Rollover State" button.
8. Once you select that, user_01 and Over State should appear below the current image. Select Over State.
9. Go back to the layers window and select your background. If you haven't already done so, make a copy of your background and delete your old one.
10. Next, select the "F" button at the bottom of the Layers window.
11. A pop-up should come up with the different effects you can use. Choose the inner glow effect. Then go back to the Rollover window.
12. The Inner Glow tab should come up in the Rollover window and then change the color to white if you have black, or black if you have white, or maybe something that you like.
13. If you have to, to make sure it works, click the Preview Button to see it.
14. To save, go to Save-> Save Optimized As, then upload all the files it gives you, onto your host.
My finished work: www.geocities.com/staticday2002/Final.html
Let me know how I did on my first tut!
Click me