Question

I’m trying to resize a browser (I know… I know…) by the width only, and would like to maintain the users current height of the browser and I’m struggling to get it working correctly under IE8.

if I do:

window.resizeTo(document.documentElement.clientWidth, document.documentElement.clientHeight);

Which should in theory, maintain the exact same size, I’m losing roughly 176 pixels from the height… and roughly about the width of the scrollbar.

I can’t find any properties which would give me the correct size of the entire browser window.

Answer 1

This isn’t the best solution, but it works.

First, save the current reported height:

var oldY = document.documentElement.clientHeight;

Second, set the window size to an a known size:

window.resizeTo(800, 600);

Next determine the amount of padding by subtracting the reported size from the known size:

var padX = 800 - document.documentElement.clientWidth;
var padY = 600 - document.documentElement.clientHeight;

Finally, set the width to the desired value plus padX, and the height to the oldY plus padY.

window.resizeTo(desiredWidth + padX, oldY + padY);

The downside to this method is that the user may notice the window changing size at the second step of the process.