Opening a new window in JavaScript

To display dynamically data, we can create an iframe, or open a new window. In the second case there it has a set of options to define what is displayed on the window or not.


These attributes are assigned when creating the window. The value is yes or no according to the state enabled or not, a an integer.

yes if scrollbars appear and no otherwise.
yes or no, depending on whether one shows the status bar or not.
yes or no, depending on whether one displays the toolbar or not.
showing the menu or not.
to be able to change the size or not. The lower right corner is designed accordingly.
including buttons for favorites.
of the window in pixels.
of the window in pixels.

There is no option to hide the address bar. This is something deliberate from browser makers, to prevent malicious sites are unmistakable on the origin of the page that is displayed.


open(url, nom [, list of properties])
Open a new window. The URL and name are given as parameters with a list of options. As an example of options: statusbar, toolbar, scrollbar, width, height ...
The options are enclosed in single or double quotation marks, and inside, separated by a comma.
Close the window. Example: x.close(); window.close();

Creating a window, interactive demo

Demonstration of the open method of the window HTML object.
Select the properties of the window to define and click on the open button. The code for the option will be displayed below the form.

In this demo, a page is loaded but its content is replaced by the following command:


Without this command, the windows does not remain displayed under IE7. You have to adapt the code as you need.

Toolbar Menubar Scrollbars Statusbar Resizable Directories

Width Height



function yesno(arg)
  if(arg) return "yes";
  return "no";

function demo()
  var t = document.myform.checktool.checked;
  var m = document.myform.checkmenu.checked;
  var s = document.myform.checkscroll.checked;
  var u = document.myform.checkstatus.checked;
  var r = document.myform.checkresize.checked;
  var d = document.myform.checkdir.checked;
  var w = document.myform.wwidth.value;
  var h = document.myform.wheight.value;
  var options = "location=yes,toolbar=" + 
          yesno(t) + 
          ",menubar=" + yesno(m) + 
          ",scrollbars=" + yesno(s) + 
         ",statusbar=" + yesno(u) +
         ",resizable=" + yesno(r) +
         ",directories=" + yesno(d) +
         ",width=" + w +
         ",height=" + h;

  var url = "window-demo.php";
  var myname = "mywindow";
  document.getElementById("storage").innerHTML = options;
  var win =, myname, options);
© 2008-2014