Popup windows - Browser differences

I am creating popup windows using window.open and setting the height and width of the created screen.

The navigation bar always appears (since this is a browser setting beyond my control). The problem is in IE/Firefox the navigation bar is excluded from the height I define which is good, but in Chrome, it is not, so my popup ends up being undersized with a right scrollbar.

What's the preferred mechanism for dealing with this.

Using a function to set the popup-height which checks the browser type and adds adjustments depending on the result?

 function popupCreator(url, popupname, height, width){

    if(browsertype=="chrome"){  //obviously not this exact code!
        height = height + 20;
    }

 开发者_开发百科   var params = 'width=' + width + ',height=' + height;
    newwin = window.open(url, popupname, params);

 }

Or is there a better way of achieving this?

The full function I am currently using:

 "popup": function (url, popupname, height, width) {
    if (null == width) {
        var width = screen.width / 2;
    }
    if (null == height) {
        var height = screen.height / 2;
    }

    var left = (screen.width - width) / 2;
    var top = (screen.height - height) / 2;
    var params = 'width=' + width + ',height=' + height;
    params += ',top=' + top + ',left=' + left;
    params += ',directories=no';
    params += ',location=no';
    params += ',menubar=no';
    params += ',resizable=no';
    params += ',scrollbars=no';
    params += ',status=no';
    params += ',toolbar=no';
    params += ',dialog=yes';
    params += ',titlebar=no';
    newwin = window.open(url, popupname, params);
    if (window.focus) { newwin.focus() }
    return false;
},

Here is my version of the same code

I assume you do a return popup(this.href,this.target,500,600) in a link

"popup": function (url, popupname, height, width) {
    var w = width  || screen.width  / 2;
    var h = height || screen.height / 2;
    if (navigator.userAgent.toLowerCase().indexOf('chrome') != -1) h+=20;
    var left = (screen.width - w) / 2;
    var top  = (screen.height - h) / 2;
    var params = 'width=' + w + ',height=' + h;
    params += ',top=' + top + ',left=' + left;
    params += ',screenY=' + top + ',screenX=' + left; // let's support older NS too ;)

    // all params that are not mentioned are off per default, 
    // all params mentioned are true per default
//    params += ',directories=no';
//    params += ',location=no';
//    params += ',menubar=no';
    params += ',resizable'; // given as an example of a =yes
//    params += ',scrollbars=no';
//    params += ',status=no';
//    params += ',toolbar=no';
    params += ',dialog'; // NS/FF only thing
//    params += ',titlebar=no';
    var newwin = window.open(url, popupname, params);
    if (newwin) { 
      newwin.focus(); 
      return false; // cancel the href
    }
    return true; // follow the href, the window was blocked
}

The visibility of navigation bar is controllable. For instance:

window.open('http://some-url', 'window-name',
    'location=yes,links=no,scrollbars=yes,toolbar=no,status=no,width=716,height=480');

Location is the only thing that cannot be hidden, because of security reasons.

Since chrome is using inner syntax and the other browser dont, you can just use this in the code aswell. and get it this easy!

window.open('http://some-url', 'window-name',
'location=yes,links=no,scrollbars=yes,width=716,height=480,innerHeight=510');

You are welcome! :D