How can I get IE width without scrollbar
I am getting browser width using the following line:
$(document).width()
and then I set the element to that width.
But in IE a horizontal scrollbar appears (the width is larger than the browser size - I think this is because it counts the width of the vertical scrollbar). I am using html 4.0 transient type. What should I do?
source to share
Try a property clientWidth
like:
$('body').attr('clientWidth')
From the Mozilla Developer Center:
clientWidth is the internal width of the element in pixels. It includes a padding, but not a vertical scrollbar (if present, if rendered), border, or margin.
From MSDN:
Retrieves the width of an object, including padding, but not including a marker, border, or scroll bar.
source to share
You can use $(window).width()
that does not include a scrollbar. However, that the width of the window is not the width of the document. The document can be much wider than the window in horizontal scrolling situations. If your page never gets wide enough for a horizontal scrollbar, this might be fine for you.
Getting document width without scrolling in IE (Quirksmode), regardless of whether there is a horizontal scrollbar, I don't know the ideal solution. This is what I am currently using:
var maxLikelyScrollbarWidth = 25; // It 20px on my IE
var hscroll = $(document).width() > $(window).width() + maxLikelyScrollbarWidth;
var widthNoScrollbar = hscroll ? $(document).width() : $(window).width();
It's not perfect, but it does the job. However, there are edge cases.
source to share