Html Pop up page using javascript

Html pop up pages are legacy ways that are used across all the web for showing small snippets of information , However they are fastly replaced via Lightbox nowadays !

Here in this tutorial we will be creating a popup javascript function which can be called multiple times on a webpage for creating different popups !, These javascript functions are easy to create and call from the links in html webpage

First of all create a file called popup.js



function popup(URL) {
var popup_width = 600
var popup_height = 400
day = new Date();
id = day.getTime();
eval("page" + id + " = window.open(URL, '" + id + "', 'toolbar=0,scrollbars=1,location=0,statusbar=0,menubar=0,resizable=1,width='+popup_width+',height='+popup_height+'');");
}

This javascript function popup will take URL in the argument and will create a new popup page when executed , The height and width of the popup page can be adjusted via popup_width and popup_height !, This function uses the inbuilt functiionality of javascript by using window.open !, This window.open takes url , id and various parameters for creating the popup page.

This simple and nifty popup page can be called via a simple href link in a html page , A small example is given below.

<a href="javascript:popcontact('pop-up.htm')">Click here</a>

Hope this tutorial helped you to learn basics of creating a popup page , Let us know your thoughts , comments and questions on comments !, We will love to help you !

4 thoughts on “Html Pop up page using javascript”

Leave a Reply