Search this site!

Return to the CSB Support home page
Pop Up 1   |   Pop Up 2   |   Pop Up 3   |   Pop Up 4   |   Pop Up 5   |   Pop Up 6   |   Pop Up 7   |   Pop Up 8
Pop Up 6
Description:
This is the same as Pop Up Windows 1, except that we will use an image link, rather than a text link.
How to use:
Create a page with the text to appear in the pop up window:

1. Create a new Trellix page with no frames or borders, just a page body, and then type in the text you wish to appear in the popup window

2. When finish, be sure to select Page Properties and give your page a short title, like: "popuptext".  This will allow you to reference this page as "popuptext.htm".

3. Locate an image (jpg or gif) file you wish to have people click on to display the pop up window.

Insert the script and image:

1. Cutand paste the code provided below into a BYOWG

2. Edit the script to reflect the name of the page contain your popup text and the image you are using.

3. Click on 'Files for this gem' and insert the image you wish to use to be clicked on.  For this example, I will be using an image of a smiley face, named: smile.gif  ...

Publish and enjoy!
Example:
  <-- click on the smiley face to open the pop up window!
Download the code
right click on link, then click on 'Save target (or frame) as'
see bottom of the page for the source code!
Other information:
When you look at the script, it actually is very simple.

You have an "open" statement with several parameters including: the name of the page with information to display, several switches, then parameters that control how big or small the pop up window should be.

After that you have the <img> tag used to associate and display the image to be clicked on in order to have the window pop up.

Notice that I've added ^GEMDIR/ in front of the name of the image. That's to let Trellix/CSB know that the image was loaded into the BYOWG using the 'Files for this Gem' option.

Source code:

<A HREF="javascript:void(0)"
ONCLICK="open('popuptext.htm', 'miniwin', 'toolbar=0, location=0, directories=0, status=0, menubar=0, scrollbars=0, resizable=0, width=300, height=300')"><img src="^GEMDIR/smile.gif"></A>