Navigation from one web page to another can happen through pop-ups generated by JavaScript.

Pop-ups are techniques that allow displaying zoom-in of an image or open a new browser with more information when a web page loads or user clicks a button …etc. Pop-ups actually show additional document to users. Popups are simple to add to sites and can have separate window and their own environment. There are several ways of adding a pop-up to a web page. The BOM method to add  pop-up is discussed below:

Syntax, name, specs, replace);


  • URL – Specifies the URL of the page to be opened. If it is not specified blank window is opened.
  • name – Specifies target attribute or name of the window. Naming a window helps in manipulating it later in script. It is an optional parameter. It can have following values:
    • _blank - is assigned to ‘name’ to open URL in new window. This is default value.
    • _parent -  is assigned to ‘name’ to open URL into parent frame.
    • _self -  is assigned to ‘name’ to replace current page.
    • _top -  is assigned to ‘name’ to replace framesets that may be loaded.
  • specs – Specification of the pop-up can be added here. All parameters given below are optional. It includes:

    • channelmode - If it is set, it displays window in theater mode. Default is false.
    • fullscreen - If it is set browsers are displayed in full screen mode. Default is false.
    • height - Height of the popup window in pixels. Minimum is 100.
    • left - Left position of window in pixels. (Negative values not allowed)
    • location - If it is set, address field is displayed. It is used in opera browsers only.
    • menubar - If it is set, menu bar is displayed.
    • resizeable - If it is set, windows are resizeable. It is used in IE browsers only.
    • scrollbars - If it is set, it displays scrollbars. It works for IE, firefox, opera browsers.
    • status - If it is set status bar is added.
    • titlebar - If it is set title bar is displayed.
    • toolbar - If it is set browser toolbar is displayed. Used in IE and firefox browsers.
    • top - The top position of window iset in pixels. Negative values are not allowed.
    • width - Width of the window in pixels, with minimum value of 100.
  • replace – This is optional parameter which replaces current document in history list when set to true. It creates new entry in history list when set to false.

Example with windows.object method in JavaScript

Popup Block and Security

Over-using of this method generating continuous pop-ups in a web-page may end up with an unpleasant experience to the user. Pop-ups are also one of the phishing techniques where users are convinced that an important message is delivered and are made to click a malware URL. Pop-ups are also a way to display ad which may not be essentially linked to the main site. 

Hence modern browsers have option to block the automatically popping up windows. There are pop-up blocking software which can be installed in computers. When a new window or a tab is not requested by the user i.e. events such as onclick, onkeypress …etc, are not triggered, these popup blockers prevents the file from being opened. If a pop-up is blocked the function returns null. It can be assigned to a variable and checked if the pop-up is blocked or not and an alert can be given to user.

Example of a blocked pop-up window with JavaScript

In the example below, the return value can be checked for null and user can be alerted if there is a popup block:

var block=false;
    smallWin ="", 'popWin', "resizable=yes, left=200, top=300, width=200, height=200");
        if(smallWin == null){
            block =true;
    block = true;
    alert(“A popup is blocked”);

Pop-ups are effective when they are results of a user actions. Below example shows an effective use of a pop-up.

Example of an effective use of a pop-up with JavaScript


›› go to examples ››