Skip to Main Content
High Performance Web Sites
book

High Performance Web Sites

by Steve Souders
September 2007
Intermediate to advanced content levelIntermediate to advanced
170 pages
4h 24m
English
O'Reilly Media, Inc.
Content preview from High Performance Web Sites

Chapter 9. Rule 7: Avoid CSS Expressions

CSS expressions are a powerful (and dangerous) way to set CSS properties dynamically. They're supported in Internet Explorer version 5 and later. Let's start with a conventional CSS rule for setting the background color:

background-color: #B8D4FF;

For a more dynamic page, the background color could be set to alternate every hour using CSS expressions.

background-color: expression( (new Date()).getHours(  )%2 ? "#B8D4FF" : "#F08A00" );

As shown here, the expression method accepts a JavaScript expression. The CSS property is set to the result of evaluating the JavaScript expression.

The expression method is simply ignored by other browsers, so it is a useful tool for setting properties in Internet Explorer to create a consistent experience across browsers. For example, Internet Explorer does not support the min-width property. CSS expressions are one way to solve this problem. The following example ensures that a page width is always at least 600 pixels, using an expression that Internet Explorer respects and a static setting honored by other browsers:

width: expression( document.body.clientWidth < 600 ? "600px" : "auto" );
min-width: 600px;

Most browsers ignore the width property here because they don't support CSS expressions and instead use the min-width property. Internet Explorer ignores the min-width property and instead sets the width property dynamically based on the width of the document. CSS expressions are re-evaluated when the page changes, ...

Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Start your free trial

You might also like

Even Faster Web Sites

Even Faster Web Sites

Steve Souders
Back-end Performance

Back-end Performance

Bruno Skvorc, Christopher Pitt, Tonino Jankov, Reza Lavaryan, Daniel Berman

Publisher Resources

ISBN: 9780596529307Errata Page