I used Easy Slider jQuery plugin before and never had problem until now. And the problem is strange. Check out this home page

The page will pop an alert showing two values:

$("#slider").width()

and

$("#slider3").width()

I already set the value for both in css. One is 710px and one is 700px.

If you run in IE9, it shows the default value of $(window).width() instead for both, whatever the window or document width currently is. FF and Chrome returned correctly. Why is that?

I used Easy Slider jQuery plugin before and never had problem until now. And the problem is strange. Check out this home page http://bit.ly/HKiWY6

The page will pop an alert showing two values:

$("#slider").width()

and

$("#slider3").width()

I already set the value for both in css. One is 710px and one is 700px.

If you run in IE9, it shows the default value of $(window).width() instead for both, whatever the window or document width currently is. FF and Chrome returned correctly. Why is that?

• javascript
• jquery
• html
• css
• internet-explorer

• 1 Can you upload the related script code as well? – Starx Commented Apr 16, 2012 at 8:17

2 Answers 2

Try the outerWidth, and make sure to wrap it in a windows.ready event listener to make sure all DOM element rendered properly before the width being computed

$("#slider3").outerWidth()

I've had problems with jQuery's width()/height()/offset().top/.left etc in the past when I used them before a certain event fully bubbled. See if setTimeout(function() { alert($('#slider').width()); }, 0); has any effect. It's a cheap nextTick() trick that might be just what you need.