Popup HTML5 Window Script
Mobile compliant responsive HTML5 CSS3 popup window script
Click here to download
Let's say you want one of your HTML pages to open as a pop-up and not as a regular linked page. For example for an F.A.Q. page. Use the code shown below to do this:
the .zip file with the .js pop-up file and sample pop-up HTML page. Put these files in your website folder. They should not overwrite any existing files.
Copy the "picts-popup" folder from the zip file into your website folder.
Select, copy, and add the following code to the head area just before the </head> of any HTML page you want to be able to open the pop-ups. (the .zip file includes a sample page).
Select, copy, and paste the following code into your html page where you want a link for the pop-up to pop open from.
Edit your pop-up.htm page (included in the download) with your own info, links and images. The sample webpage in the download is a standard HTML webpage you can edit normally and includes a css file for colors and fonts.
Adding the popup link to a menu.js or other .js file:
If you are adding this popup link to a menu.js or other .js file, you will add a \ in front of every ' in your link. Here is an example:
In the above we have added two \ like the following: \'pop-up.htm\'
Adding extra pop-ups:
You can have many pop-ups on one page. Edit the "pop-up.htm" in the code below for additional pages and copy the "pop-up.htm" and give it the name you edited the link with. Make sure the names match exactly, hosting is case sensitive. Second pop-up link example:
NOTE: Only edit the area in red for the second pop-up. Make sure you create a page called "pop-up-2.htm" for the above example.
Open in a new window, target links