Semi Transparent Background Creation

Forums: Web Development, Alpha Transparency
Email this Topic • Print this Page

I am trying to create a site that uses a photograph of lake tahoe as the main background image. Above this image I would like to place some tables that would hold the actual text and graphics for the site. I would like to be able to create a semi transparent background image in these tables that would allow easy reading of the text yet still be able to make out the picture of the lake below.

I have tried creating transparent images in photoshop CS by both the export wizard and the save for web function to no success.

Does anyone have any suggestions?

Thanks,

Jason

Topic Stats
Top Replies
Link to this Topic

Type: Discussion • Score: 2 • Views: 1,219 • Replies: 3

No top replies

You could try adding this to your CSS:

filter:alpha(opacity:50)

0 Replies

or make sure your transparent images are gifs or pngs. Both of those file formats allow for transparency.

0 Replies

jpinMilwaukee wrote:

or make sure your transparent images are gifs or pngs. Both of those file formats allow for transparency.

What he will need is variable transparency (also called alpha transparency), which png (not gif) supports but IE doesn't.

IE is your problem. You can't have variable transparency in IE and this severely limits graphic design.

Variable transparency support is coming in IE and present in all other browsers. But if you want it now you need to use some "hacks" and workarounds.

For a great write-up on alpha transparency along with some js workarounds see here:

http://homepage.ntlworld.com/bobosola/

0 Replies

Semi Transparent Background Creation

Related Topics

Quick Links

My Account

able2know