Advanced Toolbox for Web Developers
Sort by: Date · Name · Rating · Clicks
Just a few lines of codes takes a headache of changing "Copyright %CompanyName% %year%" for simple sites/pages that are not using CMS.
Since the CSS support in Internet Explorer, especially in versions prior to Internet Explorer 7, has been lagging quite substantially, clever web developers have started using CSS expressions to mimic CSS functionality. However, few realize how this affects performance.
Explaining CSS Expressions
The basic idea with CSS expressions is that you will have calculation and dynamic values for properties in the CSS code, something that people have found very useful. A simple example can be implementing
The code above evaluates the available width of the
You're probably thinking "Sweet!", and immediately start planning everything you can fix with CSS expressions to touch up on your CSS code for Internet Explorer. Away with nasty hacks; enter clean, proper and cool solution.
The other major reason is that CSS expressions are very resource intensive. The resulting value of an expression isn't just calculated once, but consistently while you're using the web page. Add moving the mouse pointer around to that, and it will trigger even more evaluation from the expression interpreter.
You've probably experienced some web pages being even more sluggish than expected in Internet Explorer, but haven't known about the reason why. Look no further: usage (especially heavy such) of CSS expressions is most of the times the culprit you want to get rid of.
Why Do People Use CSS Expressions?
I have complete understanding of people implementing CSS expressions to cover up for shortcomings in the CSS rendering engine in Internet Explorer. I also believe that since the syntax is very easy, web developers have (as always with easy code) adopted it without seriously analyzing any possible downsides to it.
To get the same result as the above CSS expression code sample, you need this code (as a suggestion included in a file named
Too much code for your taste? No more tasty one-liners? Well, do you want funky looking code (which every web developer for some reason think is obliged to belong in the CSS file/-s), or do you want code which is reliable and gives the best performance for your users? I know what my pick is, at least…
For Internet Explorer 6 Only
One more thing to note here is that you only want this example code triggered in Internet Explorer 6. Not version 7, and definitely not for any web browser provided by another vendor. Some will now cry out:
Web browser detection? That's foul play, object detection for the masses!Well, object detection is a great thing, and without a doubt the most suitable approach testing for feature support. However, in cases like this, there's no proper way to check for lack of CSS support.