Alpha question

[Developer101]

Hello. I have created a 1pixel by 1pixel gif and am using it as the background image in a table cell. I have also made it 50 alpha. Works great.

Now, the problem is that sure the background if 50% translucent, but so is the text in the cell. How can I make the background translucent, but leave the text in the cell as full opaque?

My code currently looks like:

<TABLE>
<TR>
<TD STYLE="background-image:url(images\TransBG.gif);filter:alpha(opacity=50)">
<FONT FACE=ARIAL SIZE=2 COLOR="SkyBlue">Testing...</FONT>
</TD>
</TR>
</TABLE>

[xataku_nakusute]

i was having a similar problem previously....however, with the fact that the .gif is only 1px x 1px...im kinda uneasy...

but anyway, what you can try is this:

<TABLE>
<TR>
<TD>
<img src="blah" style="filter:alpha(Opacity=50);position:absolute;">
<div style="z-index:100;position:absolute;"><FONT FACE=ARIAL SIZE=2 COLOR="SkyBlue">Testing...</FONT></div>
</TD>
</TR>
</TABLE>

[Developer101]

Hmmm, nope that didn't work.

[David Harrison]

What about just making the image 50% translucent.

[xataku_nakusute]

sorry bout that...
uhhh...perhaps....you could go ahead and do everything you had earlier cept you take the tex out of the td's and put them in some type of floating div or something and position it on top of it...

(make sure to use the z-index property!!!)

sorry if it still doesnt work

[Developer101]

Originally posted by lavalamp
What about just making the image 50% translucent.

I was under the impression you couldn't do that with gifs. Thought you had to make a gif, then make it translucent via styles on the web page?

[pyro]

Yet another example of IE's inferiority...

You can use alpha transparency with .png images in most recent browsers except (surprise, surprise) IE5.5+... Here's an article that you may find helpful, though, describing a workaround:

http://www.alistapart.com/stories/pngopacity/

[Developer101]

Ah nice. The PNG file worked like a charm. Thanks. :)

[pyro]

You're welcome... :)