The filter attribute is a proprietary one, I believe. It allows you to do a bunch of graphical effects on the page/element. I believe it is IE6 only.

Anywho, here are the options for the filter attribute:

Alpha(Opacity=?, FinishOpacity=?, Style=?, StartX=?, StartY=?, FinishX=?, FinishY=?)

BlendTrans(Duration=?)

Blur(Add=?, Direction=?, Strength=?)

Chroma(Color=?)

DropShadow(Color=?, OffX=?, OffY=?, Positive=?)

FlipH

FlipV

Glow(Color=?, Strength=?)

Gray

Invert

Light

Mask(Color=?)

RevealTrans(Duration=?, Transition=?)

Shadow(Color=?, Direction=?)

Wave(Add=?, Freq=?, LightStrength=?, Phase=?, Strength=?)

Xray


Most of them should be self explanatory. Do note that they are very slow, very very very slow, if you use it for a full page. I'm on a P4 1.6 and using Blur makes it garbage slow.

Flash files seem to get messed up with the Flip Operations. Not sure about image maps but since those are done in IE, it will prolly work correctly.

Note that using Flip V also inverts your scrolling

Anyways, If someone wants to crack something up with these, here it is. And if you can turn it into more than a cheap gimmick, I bow down.

-C

I’ve found them too clunky to be of any practical use. The alpha filter can be useful, but I would rather have proper support for PNG.

dropshadow also causes havoc with Windows XP's cleartype--a shame because ClearType looks great. Allusion is pretty much right IMHO; you should stick to graphics instead of filters especially for browser compatility (the filters are for only IE).

with mozilla, they have a replacement for alpha which is:

the entire css block wouldlook like:


i'm not sure about the rest.

What are the units for durations? Do you write style: ...(duration=500ms)? I need samples!

Oooh, this page look good http://www.webreference.com/js/column68/. Apparently you're supposed to add filter: progid : DXImageTransform.Microsoft.Opacity before your filter names.
This has a list of parameters http://webdevelopers.hypermart.net/b...es/filters.htm.

One the best quick references for filters with full code examples is this site:

http://www.fred.net/dhark/demos/css/..._examples.html

Well, I've used many of these in style sheets [usually blurs, filters, etc for hovers] mind you the opacity, etc is great for tables on images! In style sheets, I usually use:

#namehere{
filter:alpha(opacity=60, style=0);}

or something along those lines

I'd recommend not using them because...

1) They do not work on other browsers

2) The are very slow to render

3) Some effect, like glow, are poorly over used, and, as such, appear unprofessional to most users

4) Any decent paint program will do most of the image effects. If you want, an image with a shadow, just making the image 10x10 bigger and draw a shadow

5) Using proprietary technologies only leads to the proliferation of them, which hurts standards all around

just my thoughts, no offence to those who use them

6) and IE sucks anyways.

Although I am totally in agreement with tibberous on why not to ever use the propiortary filters in IE. There is one instance where one comes in handly. As I am sure you are aware, IE does not support png transparancy, however if you use 'AlphaImageLoader' you can effectivly use png's alpha transparency in IE. It is not the ideal solution, but its what we have until IE supports png alpha transparency.

Didn't know about that.

Opacity is actually a valid CSS property, but its just opacity: 0.5.

Can we use any of these to make IE properly display transparency in .png images? They're perfectly aware of the problem, but they're pretty much choosing to leave it broken. They provide a way to fix it at the developer's expense: http://support.microsoft.com/kb/294714

Could the alpha option be used on an img tag instead of that weird div thing?

Dunno what weird div thing you're talking about, but yes, AlphaImageLoader can be applied to img tags, as well.

One of the biggest problems with opacity is that it is not valid css through the w3c yet. As for filter: alpha(opacity) this is just another way the IE is trying to be different and they really need to get on the same page as everyone else because speaking as a coder it sucks when you have to go through and just find IE bugs and you know that all the other highly used browsers will work just fine with out checking for bugs.

Better yet, the filter method doesn't work in IE8. See http://www.quirksmode.org/css/opacity.html . In IE's defense, they were doing filters well before opacity existed in other browsers, or in any CSS standard.

Not that I'm supporting IE. This is the second full version without opacity support. That's just silly.

you can achieve transparency in ie 7 on wards now with transparent png images. css may not work always but the present way is to write css for each browser seperate