TeamPhotoshop
Reviews, updates and in depth guides to your favourite mobile games - AppGamer.com
Forum Home Latest Posts Search Help Subscribe

rollovers

Page: 1 Reply
Mar 22nd 2003#96471 Report
Member since: Mar 22nd 2003
Posts: 21
ok, i got a friend that i need to make his image into a site.. now i got some ?'s

he is using it for wallpapers, he wants the wallpapers part of the main image on its own layer, so that it is translucent then when you go over it, it will go to full color (no tranparency). do i have to do this as a gif and make it a rollover or something, do i need to make it a seperate image?

im new here, sorry if its wrong forum

thanks



some examples:
http://www.deathtothepixels.com/ but so it fades in and out.
http://rainworld.com/psworkshop/ and that, but they dont seem to be working, lol

ok he says its like the last link exactly, any help please?

sry made a post in a diff forum 2, think this is the right one tho
Reply with Quote Reply
Mar 22nd 2003#96477 Report
Member since: Feb 14th 2003
Posts: 685
the first reference is a flash menu w/ a simple begin opacity effect to low(prolly around 20%) and then on rollover, apply opacity effect to 100%

the second reference by chance uses some Dreamweaver extension for the fade effect (view source on the page and u can tell) -- tho there are javascripts out there that can achieve this with less effort than in Photoshop/Imageready -- yet it can be done....

In Photoshop::
1. create your button/image layer(s) -- best to use a Set
2. set the opacity of the Layer Set to about 20% (u choose)
2. apply the slice tool on the image
OR if its just a single/merged image layer goto 'Layer', 'New Layer Based Slice'
3. jump to ImageReady
4. goto rollovers tab
5. select the layer u want to apply rollover inside the rollover window
6. right click on the visible image slice in the rollover window
7. from the new pop up menu choose, 'Add Rollover State'
8. select the new rollover state inside the Rollover window to make it active
9. move over to the layers palette and choose the that same layer u applied the Opacity level earlier and change it to 100%
10 select the root rollover state(not the 'Over State')
11. goto file/save optimized as...
12. Save As Type: Html and Images
Settings: Default
Slices: All Slices

walla...
im sure there are more accurate tuts out there
but i hope this helps

cheers
heathrowe
Reply with Quote Reply
Mar 22nd 2003#96480 Report
Member since: Nov 26th 2001
Posts: 2586
The first one is in Flash, but for a simple effect like that you can achieve it making an animated .gif - which is easy to do in IR.

The fade in and out is a simple javascript - which I am not sure what extension you are refering to in DW, but it probably just writes the javascript code.

To make something change on a roll over is simple as creating 2 images. I would make them on top of each other and just hide the appropriate layer when selecting the roll over state.

You also can use layers in styles to hide or show sections.
Reply with Quote Reply
Page: 1 Back to top
Please login or register above to post in this forum