.PNG transparencies

They have: 1 posts

Joined: Jun 2007

Before I set any work into my idea, I wanted to make sure that it would work.

If I were to have a transparent .png on my page, and the background was fixed reletive to the screen, would I be able to see the background through the transparent image as I scrolled up and down? (Think Vista)

Megan's picture

She has: 11,421 posts

Joined: Jun 1999

I'm not sure what you mean about Vista but I think that yes, this would work. Transparent png's can be a bit tricky, especially in IE 6 which doesn't support the alpha transparency. There are ways to get around that though.

JeevesBond's picture

He has: 3,956 posts

Joined: Jun 2002

wrote: If I were to have a transparent .png on my page, and the background was fixed reletive to the screen, would I be able to see the background through the transparent image as I scrolled up and down?

This reminds me of a CSS Zen Garden entry. See this page: http://www.askthecssguy.com/2006/11/props_to_the_css_zen_ocean_div.html (remember when you view the entry use Opera, Firefox or Konqueror, IE and Safari don't work). Note the diver on the right and how his little light works the deeper he goes. Smiling

I wrote a hack to work around the problems in IE when displaying PNGs, see: png alpha hack.

a Padded Cell our articles site!

He has: 629 posts

Joined: May 2007

FWIW - No browser since Netscape 4 has a problem with single-color transparency 8-bit PNGs. As noted above, Internet Explorer (alone) has problems with 24-bit PNGs, with or without alpha transparency.

(To be fair, most issues are fixed in IE 7. It still suffers from a color shift if the gamma value is left in the image, though.)

Cordially, David
--
delete from internet where user_agent="MSIE" and version < 8;

timjpriebe's picture

He has: 2,667 posts

Joined: Dec 2004

Wow, that effect's awesome, Jeeves. Thanks for the link.

Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.