CSS Expressions

We can use CSS expression, to make the styling of an HTML element dynamic.

CSS are generally JavaScript driven, that means what ever we write using CSS classes, gets applied on HTML element using JavaScript. And then comes the expression in CSS, which is actually a way to write JavaScript in the CSS property.

Example:

.setTop
{
    top: expression(this.offsetParent.scrollTop);
}

This will check the scrollTop of the parent. These expressions are evaluated way more frequen

tly, which means extensive use of CSS expression, can lead to a bad user experience, and lower performance.

So, what I would prefer is to use a JavaScript function that do exactly the same thing but a very less frequent interval, rather than depending upon the browser engine and let the engine do all the work of applying CSS .

to achieve what we have written above using javascript:

function setTop(obj)
{
    obj.style.top = obj.offsetParent.scrollTop;
}
window.setInterval("setTop()",5000);