When we open a window using:

window.open("/calendar",'calendar','width=950,height=576,titlebar=no,statusbar=no,menubar=no,resizable=no,scrollbars=no');

Firefox 3 and IE 7 open it to have a content area height of 576 plus the browser items (URL bar, status bar, etc).

Chrome however opens it to have a total height of 576 meaning a scrollbar appears to the right of the content (and then the bottom because the width is now reduced).

How can I get around this? It's for a heavy layout part of a web app so it's not just a matter of "let the user scroll", the client doesn't want that.

Has anyone e across this?

I don't mind browser sniffing and opening the window bigger, but I know that's yucky these days.

When we open a window using:

window.open("/calendar",'calendar','width=950,height=576,titlebar=no,statusbar=no,menubar=no,resizable=no,scrollbars=no');

Firefox 3 and IE 7 open it to have a content area height of 576 plus the browser items (URL bar, status bar, etc).

Chrome however opens it to have a total height of 576 meaning a scrollbar appears to the right of the content (and then the bottom because the width is now reduced).

How can I get around this? It's for a heavy layout part of a web app so it's not just a matter of "let the user scroll", the client doesn't want that.

Has anyone e across this?

I don't mind browser sniffing and opening the window bigger, but I know that's yucky these days.

• javascript
• html
• css
• google-chrome

• 1 hope this help stackoverflow./questions/1994945/… – Haim Evgi Commented Jan 12, 2010 at 12:20

4 Answers 4

Unfortunately, there is no way to reliably control the window.open function. For example in Opera the pop-up window is always resizeable. And most browsers always show the URL bar for security reasons.

Either do what haim evgi's link suggests and set overflow:hidden CSS in the pop-up page, or go for in-page approach, like a lightbox script. You can open external pages in iframes using those and you can control the size exactly. They often look better, too.

I know is stupid but you can sniff chrome and increase the height. This is how i did it..

    wh=576;
    if (navigator.appVersion.indexOf('Chrome')>0) wh=wh+50;
window.open("/calendar",'calendar','width=950,height='+wh+',titlebar=no,statusbar=no,menubar=no,resizable=no,scrollbars=no');

var popup = window.open("/calendar",'calendar','width=950,height=576,titlebar=no,statusbar=no,menubar=no,resizable=no,scrollbars=no');
popup.resizeBy(0, 576 - popup.innerHeight);

Just change from 'status=no' to 'status=yes'.