How to embed Javascript in CSS?

Question

I have a CSS file, which contain the style information of my web. Some height & width is based on the screen size, so I can calculate the size using the Javascript, can I embedded the javascript in the CSS file to do so?

Lucas Jones · Accepted Answer · 2009-10-25 15:36:35Z

7

In IE, and only IE, you can use CSS expressions:

width: expression(blah + "px");

Then width becomes whatever's inside the brackets.

This only works in IE, though - so don't use it. Use a JS function to assign the elements the style with element.style.width or similar.

For example:

<script type="text/javascript">
    document.getElementById('header').style.width = (100 * 2) + 'px';
</script>

edited Oct 25, 2009 at 15:36

answered Oct 25, 2009 at 10:43

Lucas Jones

20.3k9 gold badges77 silver badges89 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

ndim Over a year ago

Shouldn't the example use .STYLE.width as well?

Lucas Jones Over a year ago

Now that you mention it, I'm not actually sure... I'll just check.

epascarello Over a year ago

Using expressions are so bad that they took it out of IE8

Lucas Jones Over a year ago

@bobince: Thanks. @epascarello: They did? Thank God. :)

cdmckay Over a year ago

Or with jQuery: $("#header").css("width", 100 * 2)

|

Federico klez Culloca · Accepted Answer · 2009-10-25 10:41:25Z

2

I don't think so, but you can do the opposite, i.e. make the javascript create an inline css on the fly.

answered Oct 25, 2009 at 10:41

Federico klez Culloca

27.3k17 gold badges61 silver badges102 bronze badges

Collectives™ on Stack Overflow

How to embed Javascript in CSS?

2 Answers 2

6 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related