Transparency in table cells

[Reggit]

I'm trying to create an HTML site where the main site background is slightly visible (Opacity tricks, more or less) when viewed through a table cell. I've seen it done before, and I'm not sure whether it's an HTML or Javascript trick. If someone could explain how I'm able to achieve this, it'd be most helpful.

Thanks for any help! ^^

[lostinbeta]

It is most likely a background image for the cell that appears to look like the background has a different opacity. There is no way to change the actual background of your page to a different opacity.

[Reggit]

I've seen it, and I'm pretty sure it's workable with javascript:

"td colspan=2 style="filter:alpha(opacity=70);"

Is an exact quote from my friends site (steel-talon.com).

If that doesn't deal with the cell background, what does it do?

[lostinbeta]

Ah yes, I forgot about filters...which is incredibly ironic since my footer uses them!

This isn't effecting the actual background image though. It is just affecting the content in the table cell (apparently including the background color or image).

Anywho, you answered your own question then :)

BTW: Filters aren't Javascript, they are CSS, just for reference.

[Reggit]

Alright, just tried the filter and instead of opacitizing (Is that a word? Eh..) the background, it rendered the picture I had on the frame to show slightly the background of that cell. What did I do wrong?

"td width="100%" height="83" colspan="3" style="filter:alpha(opacity=70);"

Edit: Nevermind, had the coding in the wrong place. :P *Hitself* Thanks for the help, again!

[lostinbeta]

Create a test document... make the body color of your html page be pure black (#000000)

Now add this to the body....


<TABLE>
<TR>
<td width="100" height="100" colspan="3" style="filter:alpha(opacity=40);" bgcolor="#FFFFFF">
</TD>
</TR>
</TABLE>

You now test your movie. Notice the background color of the cell is actually pure white, but when you view it in your browser, it is grey. That is because the opacity of the cell is at 40.

Works great for me at least.

[Reggit]

Okay, worksworks. But, now anything I put -into- the cell is also affected by the opacity filter. Is there a way to specifically direct it to only filter the background, not the code within the table cell?

[lostinbeta]

If you notice, your friends sites text is also at a lower opacity :)

There isn't a way that I know of to just target the cell background image to be opaque. I am not saying it isn't impossible, I am sure with Javascript you can direct the CSS, but I just don't know how exactly.

I don't mean to ditch out on you on this, but it is 3am here and I have to get to bed. I wish you much luck in figuring this out.

[Reggit]

3:04 here, glad I don't have class in the morning. I will bug her tomorrow about how she managed to accomplish the prior question on the last version of her site. (She is rarely on though, bah.)

Thanks again with the questions tonight. :P Wasn't expecting such haste with responses, I am thoroughly awe-sticken.

[lostinbeta]

Hey no problem with the hastiness...haha. Just doing my "job".

Good luck in contacting her... and goodnight :)

[Abraxxas]

AAAH!
There is an alpha filter for css?
Had no idea but thats AWESOME!!!!!

[lostinbeta]

Yep, there are all kinds of filter effects. If used right they can be great, but a lot of times they just look tacky.

Check them out here...

http://hotwired.lycos.com/webmonkey/97/33/index1a.html?tw=authoring

[Abraxxas]

Haha, yeah i've read about them somewhere but, as youve said already, the most of them are rather useless newbish stuff, but the alpha filter i had forgotten about...

thx for the link, anyway

[lostinbeta]

The drop shadow filter is handy sometimes also :) Keyword there is "sometimes".