Web Design Forums

Welcome! Please register or log in: Forgot your password? Why register?
You are here: Web Design Forums » Web Design Help » HTML and CSS Help » IE's Proprietary Filter CSS Setting RSS

IE's Proprietary Filter CSS Setting

This thread was started by siyan and has been viewed 9692 times, and contains 17 replies, with the last reply made by kiranshotgun.
Post Reply
1
View siyan's reputation
Posted July 12 '02 at 01:35 PM
      Posts: 42
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

Advertisement Register for free to hide these ads and participate in discussions!

2
View allusion's reputation
Posted August 2 '02 at 11:06 PM
      Posts: 10
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.

3
794 points at 99% Donor Moderator Repute WDFplus Member
Posted October 25 '02 at 10:43 PM
      Posts: 11,793
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).
filburt1, Web Design Forums.net founder
Want to advertise on this site?
Site of the Month contest: submit your site or vote for the winner!

4
View ub3r's reputation
Posted May 14 '03 at 08:45 AM
      Posts: 29
with mozilla, they have a replacement for alpha which is:

-moz-opacity:0.5;

the entire css block wouldlook like:

.whatevah{-moz-opacity:0.5;}


i'm not sure about the rest.
ub3r

5
View james's reputation
james, Must... Post... More...! Home page   Private message   E-mail
Posted May 23 '03 at 04:00 PM
      Posts: 364
What are the units for durations? Do you write style: ...(duration=500ms)? I need samples!
James H
Home Page · Mars Page · www.fihsf1.net (formerly www·fihs·net)

6
View james's reputation
james, Must... Post... More...! Home page   Private message   E-mail
Posted May 23 '03 at 04:12 PM
      Posts: 364
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.
James H
Home Page · Mars Page · www.fihsf1.net (formerly www·fihs·net)
Last edited May 23 '03 at 04:16 PM by james. Reply

7
View swampash's reputation
swampash, WDF Noob Home page  
Posted May 26 '03 at 07:51 PM
      Posts: 1
One the best quick references for filters with full code examples is this site:

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

8
View herekittykitty's reputation
Posted July 23 '03 at 10:30 PM
      Posts: 8
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

9
View tibberous's reputation WDFplus Member
tibberous, "I'm addicted to WDF" Home page   Private message   E-mail
Posted November 26 '03 at 12:37 AM
      Posts: 196
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

10
View glassowater87's reputation
Posted June 28 '04 at 11:34 AM
      Posts: 45
6) and IE ****s anyways.

11
142 points at 100% Moderator Repute WDFplus Member
glyakk, the voice of reason Private message   E-mail
Posted June 28 '04 at 12:20 PM
      Posts: 1,253
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.
WDF rules | reputation
Digiffect Studios : Media Simplified
DIYndex :Personal Inventory Manager (in development)
DIYebay :Auction manager (in development)
Wet Cracker Journal :Personal weblog


12
View glassowater87's reputation
Posted June 28 '04 at 07:33 PM
      Posts: 45
Didn't know about that.

13
View n3on's reputation
n3on, WDF User Private message  
Posted January 18 '05 at 12:20 AM
      Posts: 98
Opacity is actually a valid CSS property, but its just opacity: 0.5.

14
View Spasm's reputation
Posted February 8 '08 at 02:17 AM
      Posts: 19
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?

15
2,098 points at 100% Moderator Repute WDFplus Member
Shadowfiend, WDF Moderator Home page   Private message  
Posted February 8 '08 at 01:43 PM
      Posts: 4,121
Dunno what weird div thing you're talking about, but yes, AlphaImageLoader can be applied to img tags, as well.

16
View ShaneStrong05's reputation
Posted April 9 '09 at 10:11 PM
      Posts: 26
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 ****s 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.

17
2,098 points at 100% Moderator Repute WDFplus Member
Shadowfiend, WDF Moderator Home page   Private message  
Posted April 9 '09 at 10:57 PM
      Posts: 4,121
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.

18
View kiranshotgun's reputation
Posted November 22 '09 at 06:08 PM
      Posts: 4
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

Post Reply