Javascript Reference
Categories: popup

javascript popup Description

@March 15, 2008, 1:22 a.m.
popupFirefox/Netscape/NN n/a IE 5.5(Win) Chrome/Safari/DOM n/a  

  

A popup object is a featureless rectangular space that has none of the typical browser window chrome (borders, scrollbars, title bar, etc.) nor any reference path back to the main document. Scripts must create the popup object to a specific size and location, and populate the window with content by assigning an HTML string to the popup's document.body.innerHTML property. Your scripts must also help this region stand out from the document by assigning background colors and borders to either the popup's document.body.style property or the styles of elements inside the popup.

 

While this popup object holds what is essentially a document object, it is not related to the window object in any way, and therefore may not load external documents. It does, however, have the helpful characteristic of transcending frame and even browser window borders, giving the appearance of an operating-system level HTML content holder. Thus, you could use it for a drop-down menu or an annotation that needs to flow across frame borders or extend beyond the browser window edge.

 

A popup is a transient visual element. A click anywhere outside of the popup causes the popup to disappear. But you can assign the full range of mouse events to the elements in the popup's document, for effects such as rollovers and menu item clicks. The HTML content may also contain images.

 

To create a popup object, use the window.createPopup( ) method. Here is a simple example of the typical creation, population, and display sequence:

var popup = window.createPopup( );
var bod = popup.document.body;
bod.style.border = "3px solid #ff8800";
bod.style.padding = "2px";
bod.style.backgroundColor = "lightyellow";
bod.innerHTML = 
  <p style='font-family:Arial, sans-serif; font-size:10px'>Some popup text.</p>";
popup.show(100, 100, 100, 26, document.body);"
 
Object Model Reference
 
popupObjectRef
 
Object-Specific Properties
 
documentisOpen
 
Object-Specific Methods
 
hide( )show( )
 
Object-Specific Event Handler Properties

None.

This only works in IE, what about other browsers?
V - 2011-02-05

Powered by Linode.