Solved

smooth shadow

Posted on 1998-08-14
13
339 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
  • 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
Networking for the Cloud Era

Join Microsoft and Riverbed for a discussion and demonstration of enhancements to SteelConnect:
-One-click orchestration and cloud connectivity in Azure environments
-Tight integration of SD-WAN and WAN optimization capabilities
-Scalability and resiliency equal to a data center

 

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

Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

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

Suggested Solutions

Introduction When sharing photos, especially via e-mail, the large resolution images that most cameras take today make for extremely large file sizes. The time required to upload these files to forums, send in e-mails, post to blogs or even placi…
Read about why website design really matters in today's demanding market.
When you create an app prototype with Adobe XD, you can insert system screens -- sharing or Control Center, for example -- with just a few clicks. This video shows you how. You can take the full course on Experts Exchange at http://bit.ly/XDcourse.
I designed this idea while studying technology in the classroom.  This is a semester long project.  Students are asked to take photographs on a specific topic which they find meaningful, it can be a place or situation such as travel or homelessness.…

840 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