1 Stop Popup - Popup Creator makes your JavaScript popup in seconds!

Popup Creator Help

Popup Creator Options
Working Examples
Creating a Popup and Adding the JavaScript Code to your Web Page
JavaScript Close Window Codes

 

Popup Creator Options

Web Page URL to popup:
This is the URL of the page you want to display in the popup window.
It's safer if you use an absolute address like http://www.youdomain.com/PopupFileName.htm
but you can also use a RELATIVE address like PopupFileName.htm (just make sure your popup page file is in the same directory as the page that calls the popup).

Name of the Function:
Enter a name for the popup function. If you have more than one popup on the same launch page, you have to change the popup function name.

Popup Window Name:
If you have more than one popup on the same launch page, each popup will have it's own window. If you do not change the popup window's name, the second popup will replace the first popup.

 

Front or Back Window:

In Front (popup):
In front, the popup window will have the focus (the popup window will be displayed in front of the current window)

In Back (popunder):
In back, the popup window will NOT have the focus (the popup window will be displayed behind the current window)

 

Window Activation:

Standard link:
Select to create a standard link to display the popup window.

Image link:
Select to create an image link to display the popup window.
(An image link is an image that open a popup window when
a visitor clicks on the image).

Form Button:
Select to create a form button to display the popup window.

When Page Loads:
Select to display the popup window when the page loads.

When Page Unloads:
Select to display the popup window when the visitor leaves the page.

Text Mouse Over:
Select to create a text link that will display the popup window
when a visitor's mouse hovers over the text link.

Image Mouse Over:
Select to create an image link that will display the popup window
when a visitor's mouse hovers over the image link.

Note: If the popup window is activated by an Image Link or an Image Mouse Over, you must indicate the url of the image, its width and height:
Image's Url: Is the Url of the Image Link or Image Mouse Over.
Width:
Is the width of the Image Link or Image Mouse Over (in pixels).
Height:
Is the height of the Image Link or Image Mouse Over (in pixels).

Note: When a popup window is opened with a text or image "on mouse over" event, the larger the popup window is, the slower the opening reaction will be.
Try to avoid this type of popup as it tends to give a sluggish navigational feeling to the visitors.

 

Dimensions:

Popup Size:
The dimensions allow you to specify the size (in pixels) of the popup window.

Width:
Enter the width of the popup window (in pixels).

Height:
Enter the height of the popup window (in pixels).

FullScreen:
The popup window will cover the entire screen.
(Make sure you insert close codes in the popup window, otherwise your visitor will not know how to close the popup window).

 

Position:
The Position lets you decide where the window will popup.

Specify:
By selecting Specify, you can set the position of the popup.

Top:
Enter the top co-ordinate of the popup window
(number of pixels from the top of the screen).

Left:
Enter the left co-ordinate of the popup window
(number of pixels from the left of the screen).

Center:
The JavaScript code will calculate the center position for you.

 

Options:

Location Bar:
When checked, the location bar (also known as the Address bar) will be displayed.

Directories:
When checked, the directories (also known as the Links in Internet Explorer) will be displayed.

Menu Bar:
When checked, the menu bar (File, Edit, View, etc.) will be displayed.

Tool Bar:
When checked, the tool bar (the icons like Forward, Back, etc.) will be displayed.

Status Bar:
When checked, the status bar (located at the bottom of the window) will be displayed.

Resizable:
When checked, the user can resize the window.

Scrollbar:
When checked, the scroll bar will be displayed.

 

First visit Popup:
When checked, the popup window will pop only once per browser session.
(A browser session is alive as long as the browser is open. Once you close your browser, the session ends. If you restart your browser, a new browser session is created.)

or Repeat Popup after: x days:
With this feature you can determine the number of days between popups.
If you want your visitors to see the popup window at every visit, set it to "0".
If you set it at "99", the popup window will be seen only once.

Delay Popup by x seconds:
This is one of the most powerful features of Popup Creator.
By default, "When Page Loads" popup window activation is selected, the popup window is displayed without any delay. However, if you select the "Delay Popup" option, you will be able to delay the popup creation by the amount of seconds that you specify.

Working Examples

Note: Pay special attention at the <body> tag of the "when a page loads" and "when a page unloads" examples.

1. Click here to get the example files.
    (Only available when you purchase Popup Creator)

2. Check the live popup examples:

Open a popup window with a link.

Open a popup window with an image link.
    (Only available when you purchase Popup Creator)

Open a popup window with a button.
    (Only available when you purchase Popup Creator)

Open a popup window when a page loads.
    (Only available when you purchase Popup Creator)

Open a popup window when a page unloads.
    (Only available when you purchase Popup Creator)

Open a popup window when a page loads and unloads.
    (Only available when you purchase Popup Creator)

Open a popup window with a text mouse over.
    (Only available when you purchase Popup Creator)

Open a popup window with an image mouse over.
    (Only available when you purchase Popup Creator)

 

Creating a Popup and
Adding the JavaScript Code
to your Web Page

1. First, fill in the blanks in the Popup Creator interface.

2. Click on the "Create Code" button.

3. Click on "Test the Popup" button.

4. If you do not like the popup's look, click on "Reset" and start over.

5. Click on the "Select Text" from the FIRST form box and

Copy the JavaScript code that starts with:

<SCRIPT LANGUAGE='JAVASCRIPT'
TYPE='TEXT/JAVASCRIPT'>
< !--

and ends with:

// -->
< /script>

and paste this code in the launch page between the
< HEAD> and </HEAD> section.

6. Click on the "Select Text" from the SECOND form box.

    You now have 2 choices:
    • a) Do the step for Standard link, Image link, Form button,
           Text mouse over, or Image mouse over popup
    or
    • b) Do the step for Page Load or Page Unload popup

6a Step for Standard Link, Image Link, Form Button,
      Text Mouse Over and Image Mouse Over popup

Click on the "Select Text" from the SECOND form box
and Copy the HTML code that starts with:

<a href="javascript: or <input type="button"

and paste this HTML code in the launch page at the exact location you want the Popup window to be activated from (Text Link, Image Link, Button, Text Mouse Over, or Image Mouse Over).

 

6b Step for Page Load and Page Unload popup

Click on the "Select Text" from the SECOND form box
and Copy the HTML code that starts with:

<body onLoad= or <body onUnload=

and paste this code by replacing the <BODY> tag with the new code.

Example 1: If your launch page has a line with this code:
<body>
that tag will be replaced by:
(Only available when you purchase Popup Creator)
or with something similar to this (it all depends on your selected popup options).

Example 2: Your launch page has a line with the following code, or something similar to it:
<body bgcolor="#FFFFFF">
In this case (when the <body> tag is different than just <body>), you
1. Select only the "<body" part of the tag and paste the HTML code to replace it.
After your paste, the body tag will look like this:
<(Only available when you purchase Popup Creator)>
2. You have to REMOVE the first closing '>'
that was pasted with the code because the body tag would otherwise close before it should.
The final result should be similar to this:
    (Only available when you purchase Popup Creator)
In other words, if the <body> is longer than <body>, just replace <body with the new code and remove the first '>' so the <body> tag can close like it should.

7. You now have finished creating your popup!

 

JavaScript
Close Window Codes

It is important to allow your visitors to close the window that you have created.
Don't leave your visitors in a popup nightmare!

Close window link:
    (Only available when you purchase Popup Creator)

Click anywhere to close:
    (Only available when you purchase Popup Creator)

Note: if the <body> tag is different than just <body>, you
1. Select only the "<body" part of the tag and paste the HTML code to replace it.
After your paste, the body tag will look like this:
    (Only available when you purchase Popup Creator)
2. You have to REMOVE the first closing '>'
that was pasted with the code because the body tag would otherwise close before it should.
The final result should be similar to this:
    (Only available when you purchase Popup Creator)
In other words, if the <body> tag is longer than <body>, just replace <body with the new code and remove the first closing '>' so the <body> tag can close like it should.

Close window button:
    (Only available when you purchase Popup Creator)

Close window image:
    (Only available when you purchase Popup Creator)

© Copyright (C) 2003-2013 by 1stoppopup. All Rights Reserved.
886 de L'Epee ave., Outremont, QC
1stop@videotron.ca