WillMaster Possibilities -- Source code and simple instructions for Picture Popups

The "Picture Popups" system requires one JavaScript function. Place it somewhere between 
the <head> and </head> tags of your page.

========Begin JavaScript Function========
<script language="JavaScript">
<!-- Copyright 1999 by William and Mari Bontrager.
function PopupPicture(url,h,w,tl,bgcolor,textcolor) {
var title = '<br><b>' + tl + '</b>';
var hh = String(parseInt(h,10)+67);
if(tl.length < 1) title = '';
else hh = String(parseInt(hh) + parseInt((tl.length / (parseInt(w) / 7)) + 1) * 18);
var bbc = ' bgcolor="' + bgcolor + '"';
if(bgcolor.length < 1) bbc = '';
var ttc = ' text="' + textcolor + '"';
if(textcolor.length < 1) ttc = '';
var Properties = 'height=' + hh + ',width=' + String(parseInt(w,10)+25);
var pPicture = window.open('','',Properties);
pPicture.document.writeln('<html><head><title>' + tl + '<\/title>');
pPicture.document.writeln('<script language="JavaScript">');
pPicture.document.writeln('<!-- ');
pPicture.document.writeln('function CloseMe() {');
pPicture.document.writeln('self.close();');
pPicture.document.writeln('}');
pPicture.document.writeln('\/\/ -->');
pPicture.document.writeln('<\/script>');
pPicture.document.write('<\/head><body ' + bbc + ttc + '" onBlur="CloseMe()"><center>');
pPicture.document.write('<IMG SRC="' + url + '" width="' + w + '" height="' + h + '" border="0" alt="' + tl + '">');
pPicture.document.write(title);
pPicture.document.write('<p><form><input type=button onClick="window.close()" value="Close Window"><\/form>');
pPicture.document.writeln('<\/center><\/body><\/html>');
}
//-->
</script>
========End JavaScript Function========


Once the above function is in place on your page, all you have to do is link your pictures.

Here is the format for your links:

     <a href="javascript:PopupPicture(...)">Link image or text</a>

Replace the ... with:
     'url_of_graphic','pixel_height','pixel_width','title','background_color','text_color'

Sections:
  url_of_graphic (required): A relative URL or complete http://... URL
    pixel_height (required): Height of your graphic, in pixels
     pixel_width (required): Width of your graphic, in pixels
           title (optional): A title for the popup window and to display under your picture.
background_color (optional): The background color of the popup.
      text_color (optional): The text color of the title under the picture.

Each section is enclosed in single quotes (apostrophes).

The sections are separated with a comma.

If any of the optional sections are blank, they still must have the two apostrophes. 
Thus, the minimum information for the ... would be:

     'url_of_graphic','pixel_height','pixel_width','','',''

Example: With a background color but no title or text color, the ... would be:

     'url_of_graphic','pixel_height','pixel_width','','background_color',''

Note: If your title contains any single quotes, enclose the title in double quotes 
      (rather than the single quotes as instructed above). Then, your title would be:
          "Mari's Title"
      rather than:
          'The Title'

Here is an example link:

<a href="javascript:PopupPicture('images/atriver.jpg','290','215','','','')">Text Link</a>