开发者

CSS expressions vs Filters and Javascript for internet explorer

开发者 https://www.devze.com 2023-02-07 04:59 出处:网络
What is the difference between CSS expressions and CSS Filters? Are both bad for page speed? If something can be achieved in pure CSS in other browsers but for IE only possible by CSS expressions or

What is the difference between CSS expressions and CSS Filters?

Are both bad for page speed?

If something can be achieved in pure CSS in other browsers but for IE only possible by CSS expressions or CSS Filters or Javascript. Then should we always go for Javascript, if we are concerning the page speed.

Will Javascript be quicker in rendering than CSS Filter or Expression solution?


Update after Pekka's answer

OK so CSS expressions should be avoided, it's clear.

Now I want to know about Filters

Example of filters

#myElement {
    opacity: .4; /* other browsers */
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=40); /* this works in开发者_开发百科 IE6, IE7, and IE8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=40)"; /* this works in IE8 only */
}

To get PNG Transparency in IE6 and some CSS 3 effect in IE 6,7,8 We can use CSS IE Filters

http://www.smashingmagazine.com/2010/04/28/css3-solutions-for-internet-explorer/

and there are also some Javascript alternative available.

Will Javascript be quicker in rendering than CSS Filter ?

Note: The filter property is not valid CSS


In older versions of IE, if you have the choice to use a CSS filter or a CSS expression, the filter is the better choice.

However, I can't think of a single scenario where you have the choice of a filter or an expression.

You should favor plain Javascript over expressions, because expressions are evaluated constantly, for instance on mousemove. With plain Javascript, you can control when the code runs, for example onload, or onresize.

See a Google document on the subject:

CSS expressions degrade rendering performance; replacing them with alternatives will improve browser rendering for IE users.

Note: This best practices in this section apply only to Internet Explorer 5 through 7, which support CSS expressions. CSS expressions are deprecated in Internet Explorer 8, and not supported by other browsers.


The things filters are used for in IE, there is often no way to replace them.

There is no way to "use Javascript" instead, because the Javascript will just be dynamically applying the filter. This is the case for transparency, and the rgba gradient filter workaround.


In response to your edit:

and there are also some Javascript alternative available.

Will Javascript be quicker in rendering than CSS Filter ?

In the article you linked to, none of workarounds have a filter solution and a Javascript solution (the ones that do are just applying the same filter automatically, for convenience).


If you are referring to IE6's CSS Expressions, you should totally drop those and use jQuery.

IE CSS expressions

  • Used to work only in IE up to 7
  • Have been discontinued by Microsoft
  • Achieve nothing that jQuery can't do, it's just a bit more convenient
  • According to this, they used to require JavaScript to be enabled
  • In conclusion, were a bad idea.
0

精彩评论

暂无评论...
验证码 换一张
取 消