Solved

smooth shadow

Posted on 1998-08-14
13
352 Views
Last Modified: 2010-05-18
I would like to know if there is a way to do a smooth shadow (with transparency) in a format for the web. I have been trying with the PNG format, suported by Photoshop and Image Ready, but when imported in the html code I cant see in the browsers (4.0)
0
Comment
Question by:jcisne
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
  • 3
  • 2
  • +4
13 Comments
 
LVL 1

Expert Comment

by:Undertow
ID: 1116086
Only Netscape supports .PNG.  That would be the only way to do it w/ transparency.
0
 

Expert Comment

by:maradona
ID: 1116087
You have to export your psd as Gif 87/89, selecting the transparente colour.
0
 

Expert Comment

by:lvalics
ID: 1116088
Smooth shadows never will be see with transparancy. Try to export with that background where you will be use the picture.
In else way you will get some colors around the shadows.
If you have background with texture the problem is more complicated, because the HTML background and picture background will be hardly to seamless together.

Best wishes,
Valics Lehel
0
Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

Author Comment

by:jcisne
ID: 1116089
About maradona´s answer, the point is to do a smooth gradient transparency, not just a flat color. Does anyone knows if there is a plug in to view the PNG format in Explorer?
0
 
LVL 1

Expert Comment

by:x30
ID: 1116090
The only way to that efect es via java programming, you'll have to make a have program that let you transparent the images (tough), another way wich is easier, is putting a backgorund color that can be equalized with and independet smoth shadow images, foe ex. you make an image with a shadow, over a blue bakground, then, you put the image on the web page, set the bakground color to blue, and you'll have the efect.
0
 

Author Comment

by:jcisne
ID: 1116091
The background is not a flat color, so I need the shadow be independent of the background.
There is posible that a java routine make the alpha channel be a gradient from black to white?
0
 

Expert Comment

by:Hohmann
ID: 1116092
In Photoshop: Select your shadow area. Do a gradient fill, so that the dark part of the shadow is near the beginning of the shadow.  (Or do it however ou want... You know what shadows look like)

"But wait, Hohmann... You can't have a gradient fill in an image with an indexed pallette!"  Is probably what ou're saying...  well you're right.  You don't use a gradient color to color, you fill it with a pattern.  A pattern of black dots really close together, to a pattern of dots further apart.

Its not the smoothest gradient you'll see, but it works and looks fairly decent for transparent PNGs or GIFs.  (I can't take all the credit for this,  a friend of mine discovered the method while madly trying to finish a project on time)

My apologies, if this message is a little muddled.  But its late here, and well... You'll probably get the gist of it.
0
 

Author Comment

by:jcisne
ID: 1116093
I think the Hohmann answer is the most close to solve the problem, so I sugest submit it like a proposed answer.
0
 

Expert Comment

by:tfp
ID: 1116094
The problem is that your shadow won't be transparent. It will be, for example, with different shades of gray. If you've got a background which is not single colored:
In layer 1 : your image
In layer 2 : your background
then you make the shadow (copy layer 1 -> layer 1 copy), play with the contrast and the blur. and change the mode of the layer to something like "Screen".
Now your shadow will be "on" the layer 2.
Now put your image with something like Fusion 3 exactly over the backgound. People won t notice the difference between your background and your image. Your image is not transparent BTW.
0
 

Expert Comment

by:Hohmann
ID: 1116095
heh. I would but its not given as an option.  I'm assuming its because the question is locked.
0
 

Author Comment

by:jcisne
ID: 1116096
For tfp:  I need the image float over the background, and that the shadow looks fine all time, no matter the position.
0
 

Expert Comment

by:tfp
ID: 1116097
Then you can't make it. The shadow is not something transparent, it is gray for example (and it has different shades of gray, whereas you can only have one transparent color). It cannot "mix" with the background like you would do with Photoshop.
0
 

Accepted Solution

by:
Hohmann earned 50 total points
ID: 1116098
As in my comment.  But I forgot to mention that you need to choose a color in the fill pattern as transparent when you export it as a GIF.
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

HOW TO CREATE A WEB 2.0 IMAGE WITH A REFLECTION I would like to start by saying I know Web 2.0 isn't a style. It is actually the practice of information sharing or  collaboration on the Web. It is also associated with the technology that is used …
In this article, I'll explain how to change the color of a selection in Photoshop. I'm sure there are a couple different ways to do this in photoshop, but this is my preferred method in Photoshop. I am using Photoshop CS6 and I will be adjusting the…
In this tutorial viewers will learn how to correct colors in Photoshop using the Hue and Saturation adjustment Open a photo for editing in Photoshop: Begin by creating a new adjustment layer by going to Layer > New Adjustment Layer > Hue and Saturat…
In this tutorial viewers will learn how to create a vector texture to apply a non-rasterized texture to vector images, using Photoshop and Illustrator Open a textured image such as a scanned-in piece of cardboard in Photoshop: Convert the texture to…

728 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question