Published on: 15 Dec, 2013

How to create popup window in Javascript?

Tumblr Digg Google Plus

In this tutorial you will learn how you can create a popup window in javascript. You will see the quick demo below. Further reading, you will find how to write your first script to create the window popup in Javascript.

Quick demo on how popup window works in Javascript.

Click this button or link to see the popup window.

or click this link.

The javascript has a built in function that can be used to popup a window. Below is the syntax of the function

window.open('url','popupwindowname','popupattributes'')

You can embedded the function directly to a button or link or even you can bind it to a function. See example to bind it to a function

function openNewWindow(url){
window.open(url,'windowname','width=500,height=500');
}

Here is another example to bind it directly to a link or button

<a href="javascript:window.open('http://www.webkeet.com','windowname','width=500,height=500')">Click here to open new window</a>

<input value="Submit" onclick="javascript:window.open('http://www.webkeet.com','windowname','width=500,height=500')" type="button">

Below are the available popup attributes or arguments:

  • width: the width of the popup window [ex value: 500]
  • height: the height of the popup window [ex value: 500]
  • resizable: if the popup window can be resizable [ex value: yes or no]
  • scrollbars: if the popup window need a scrollbar [ex value: yes or no]
  • toolbar: if the popup window need a navigation bar [ex value: yes or no]
  • menubar: if the popup window need a menu bar like File, Edit [ex value: yes or no]
  • statusbar: if the popup window need a status bar at the bottom of window [ex value: yes or no]

Comments

There are no comments available.

Write Comment
0 characters entered. Maximum characters allowed are 1000 characters.