Cross-Browser Script Reference

Main Page | Script Demos | Test Page

Client Properties
The Client object has all the navigator properties and the following:
Client.opera.....returns true for Opera 5+ browsers.
Client.opera7.....returns true for Opera 7+ browsers.
Client.kon.....returns true for Konqueror 2+ browsers.
Client.kon2.....returns true for Konqueror 2 browsers.
Client.kon3.....returns true for Konqueror 3+ browsers.
Client.ie.....returns true for IE 4+ browsers.
Client.ie4.....returns true for IE 4 browsers.
Client.ie5.....returns true for IE 5+ browsers.
Client.ie6.....returns true for IE 6+ browsers.
Client.ns.....returns true for Netscape 4+ browsers.
Client.ns4.....returns true for Netscape 4 browsers.
Client.ns6.....returns true for Netscape 6+ browsers.
Client.moz.....returns true for Mozilla 1+ (or equivalent) browsers.
Client.style.....returns true for browsers that can dynamically change styling (ie4+,ns6+....).
Client.nodes.....returns true for browsers that have nodes (ie5+,ns6+.....).
Client.cssBox.....returns true for browsers that comply with the W3C CSS box model.

Layer Methods
pxHeight(value,offset)
pxWidth(value,offset)
Sets or returns the dimensions of a layer.
value can be either an integer or a percentage¹ (eg "45%").
offset is an integer which can be used to offset this value.
Returns calling layer if setting value,otherwise the property value is returned.

resizeTo(width,height)
Sets the both the width and height values of a layer.
Returns the calling layer.

pxLeft(value,offset)
pxTop(value,offset)
Sets or returns the offset position of a layer's edges.
value can be an integer.
value can be a percentage¹ (eg "45%").
value can also be a "pos" value, the layer is then set to that position in the window.
For example, "cssLayers[0].pxLeft('50 pos')" would center the layer in it's parent Layer.
offset is an integer which can be used to offset this value.
Returns calling layer if setting value,otherwise the property value is returned.

absLeft()
absTop()
Returns the position of a layer's edges relative to the page.

moveTo(left,top)
Sets the left and top values of a layer.
Returns the calling layer.

Index(integer) ²
Visibility("value",exclude_3d) ² Sets or returns the z-index/visibility values.
value can be "hidden","visible" or "inherit".
exclude_3d is a boolean value,if true,the visibility of any attached 3d effect is not set.
Returns calling layer if setting value,otherwise the property value is returned.

posX(integer)
posY(integer)
Returns the pixel value of a layer's possible position.
For example,"cssLayers[0].posX(50);" would return the pixel value of "cssLayers[0].pxLeft('50 pos')".
percentX("percent")
percentY("percent")
Converts a percentage¹ to a pixel value and returns it.
percent is a percentage value.
setBgColor("color")
setBgImage("image url")
Sets the bgColor/bgImage of a layer.
These are removed if no parameter is used.
Returns the calling layer.

setContent("content") Sets the content of a layer.
content is a string of HTML to be set.
This can be accessed though the "innerHTML" property.
Returns the calling layer.

holds(child) Returns true if an element is a descendant of another element.
child is the element to checked for containment.

insertElement
("id",width,"tag",index)
Creates and inserts a new hidden positioned element at the coordiates 0,0.
id sets the layerName property(must be unique) of the element.
width sets the true width of the element.
tag sets the type of element (default is "DIV").... Netscape 4 will always insert a layer regardless of this setting.
index a boolean value,if true,the element is not indexed.
All parameters are optional.
Returns the inserted element.
Note:This is also a method of the window.

setEventHandler
("type",pointer,index)
Sets a event handler for a layer.
Also see the event object's properties and methods.
type is the type of event (eg "keypress").
pointer is a function (or null to cancel) to be assigned.
index is the index number(default is 0) of the event handler.
This allows multiply handlers to be set for a single event type.
Note: This is also a method of window and document.

sendEvent(event)
Triggers an event for a layer.
event is an event object.
This object must have a type which has been registered using setEventHandler().
Note: This is also a method of window and document.

load("url",width)
Loads an external document and sets the width for a layer at the same time.
This is a native method for layers in Netscape4.
In other browsers this is used with iframe elements.
url is the url of the document to be imported.
width is the width of the document.

Layer Properties
layerObject.arrayIndex......returns a layer's index position in the allLayers array.
layerObject.layerName......returns a layer's id or name attribute.
layerObject.owner......returns the element to which the layer is attached during setup.
layerObject.frameWindow......returns the layer's (iframe) window object or the layer itself.
layerObject.page......returns the layer's (iframe) document object or the layer itself.
layerObject.isNewLayer......returns "true" if a layer was created with insertElement().
layerObject.isNested......returns "true" if a layer is nested inside another layer.
layerObject.next......returns the next layer in the document order(returns null if undefined).
layerObject.previous......returns the previous layer in the document order(returns null if undefined).
layerObject.nextLayer......returns a layer's next sibling(returns null if undefined).
layerObject.previousLayer......returns a layer's previous sibling(returns null if undefined).

Layer Arrays
layerObject.images......A collection of the image elements a layer contains.
layerObject.forms......A collection of the form elements a layer contains.
layerObject.links......A collection of the link elements a layer contains.
layerObject.cssLayers......An Array of the nested layers a layer contains.

Window Methods
pxHeight()
pxWidth()
Returns the dimensions of the window's viewing area.

offsetLeft()
offsetTop()
Returns how far the window has been scrolled.

selectedText() Returns the selected text on a page.
Document Methods
pxHeight(integer)
pxWidth(integer)
Returns the document's height/width.
This can be set in Netscape 4 by using the parameter.
holds(child) Returns true if an element is a descendant of the document.
child is the element to checked for containment.

Document Properties
document.owner......the element the document is attached to during the setup.
document.window......the parent window of the document.
document.all......a collection of all the elements on the document (not available in Netscape 4).

allLayers & cssLayers Array Methods
addMethod
("name",pointer)
Allows a method to be added to all the layers in an array.
name is the reference name to assign to the method.
pointer is the function to be assigned.

Event Object Properties
The event object needs to be setup using the setupEvent() function.
The setEventHandler() method runs this function automatically.
The event object is passed to the handler via the first parameter.
It has the following compatible properties:
eventObject.clientX......returns a cursor's x-position relative to the viewing area.
eventObject.clientY......returns a cursor's y-position relative to the viewing area.
eventObject.pageX......returns a cursor's x-position relative to the document.
eventObject.pageY......returns a cursor's y-position relative to the document.
eventObject.screenX......returns a cursor's x-position relative to the screen.
eventObject.screenY......returns a cursor's y-position relative to the screen.
eventObject.click......returns which mouse button is pressed (left=1,middle=2,right=3).
eventObject.key......returns the unicode value of the key pressed.
eventObject.altKey......returns true if the Alt key is pressed.
eventObject.ctrlKey......returns true if the Ctrl key is pressed.
eventObject.shiftKey......returns true if the Shift key is pressed.
eventObject.relatedElement...... returns the related target for mouseover and mouseout (n/a in Netscape 4).
eventObject.time......returns the time in milliseconds since Jan.1,1970.
eventObject.previous......returns the previous event object of the same type called by the same object
eventObject.caller......returns the object which called the event handler.
eventObject.window......returns the window where an event occurred.
eventObject.type......returns the type of event.

Event Object Methods
getTarget(scope)
Returns the target object of an event.
scope sets the scope of the event targeting with the values below.
0....returns the target as it would in Netscape 4 (default).
1....returns the actual target Element,Netscape 4 returns null.
2....returns only target textNodes in browsers that support it.
Other browsers would return null.
"layer".......returns the target Layer.

getPhase(scope)
Gets the current phase of an event and returns an integer.
Returns 2 if the event is at the target,3 if the event is bubbling.
scope sets the scope of the event phase.
The arguments are the same as with getTarget().

stopPropagation()
Stops the event spreading (bubbling) to other objects.

getLayerX()
getLayerY()
Returns the cursor's position relative to a layer.

Setup Functions
cbSetup("tagName") The main setup function.
This needs to be called after the page is loaded.
tagName is a tagName of the elements to be indexed in non-Netscape 4 browsers (default is "DIV").

setupFrame(frame,"tagName") Similiar to cbSetup(),used for setting up secondary frames/iframes/windows.
frame is the frame to be setup,this could be a name(a string) of an iframe.
It can also be a actual frame or external window.
tagName is a tagName of the elements to be indexed in non-Netscape 4 browsers (default is "DIV").
Returns the frame on which is setup is done.

setupCollection(collection) Gives members of a collection the basic methods on the cbscript.js file.
collection is the collection (eg document.links) to be setup.
These collections are not indexed.

Other Functions
setupEvent(event)
Modifies the event object to make it compatible and adds several properties and methods.
This function is used within an event handler that was not assigned using setEventHandler() (which runs it automatically).
event the first argument of the event handler,which passes the event object.
Returns the modified event object.
createEvent("type")
Creates a new event object.
This object could be used with the sendEvent() method.
type is the type of event.
Returns the event object.
getParent(object,doc)
Returns an object's parent layer.
For top level objects this returns the window (unless the 2nd parameter is used).
object is the object for which the parent is to be retrieved.
doc a boolean value,if true,returns the document as the parent of top level objects.

doNothing()
A dummy function which does nothing at all.

Foot Notes
¹ Percentages are based on the size of the document or window,whichever is larger.

² Some style properties may need to be set inline or via scripting before the value can be retrieved.

Client Properties
The Client object has all the navigator properties and the following: Client.opera.....returns true for Opera 5+ browsers. Client.opera7.....returns true for Opera 7+ browsers. Client.kon.....returns true for Konqueror 2+ browsers. Client.kon2.....returns true for Konqueror 2 browsers. Client.kon3.....returns true for Konqueror 3+ browsers. Client.ie.....returns true for IE 4+ browsers. Client.ie4.....returns true for IE 4 browsers. Client.ie5.....returns true for IE 5+ browsers. Client.ie6.....returns true for IE 6+ browsers. Client.ns.....returns true for Netscape 4+ browsers. Client.ns4.....returns true for Netscape 4 browsers. Client.ns6.....returns true for Netscape 6+ browsers. Client.moz.....returns true for Mozilla 1+ (or equivalent) browsers. Client.style.....returns true for browsers that can dynamically change styling (ie4+,ns6+....). Client.nodes.....returns true for browsers that have nodes (ie5+,ns6+.....). Client.cssBox.....returns true for browsers that comply with the W3C CSS box model.
Layer Methods
pxHeight(value,offset) pxWidth(value,offset)	Sets or returns the dimensions of a layer. value can be either an integer or a percentage¹ (eg "45%"). offset is an integer which can be used to offset this value. Returns calling layer if setting value,otherwise the property value is returned.
resizeTo(width,height)	Sets the both the width and height values of a layer. Returns the calling layer.
pxLeft(value,offset) pxTop(value,offset)	Sets or returns the offset position of a layer's edges. value can be an integer. value can be a percentage¹ (eg "45%"). value can also be a "pos" value, the layer is then set to that position in the window. For example, "cssLayers[0].pxLeft('50 pos')" would center the layer in it's parent Layer. offset is an integer which can be used to offset this value. Returns calling layer if setting value,otherwise the property value is returned.
absLeft() absTop()	Returns the position of a layer's edges relative to the page.
moveTo(left,top)	Sets the left and top values of a layer. Returns the calling layer.
Index(integer) ² Visibility("value",exclude_3d) ²	Sets or returns the z-index/visibility values. value can be "hidden","visible" or "inherit". exclude_3d is a boolean value,if true,the visibility of any attached 3d effect is not set. Returns calling layer if setting value,otherwise the property value is returned.
posX(integer) posY(integer)	Returns the pixel value of a layer's possible position. For example,"cssLayers[0].posX(50);" would return the pixel value of "cssLayers[0].pxLeft('50 pos')".
percentX("percent") percentY("percent")	Converts a percentage¹ to a pixel value and returns it. percent is a percentage value.
setBgColor("color") setBgImage("image url")	Sets the bgColor/bgImage of a layer. These are removed if no parameter is used. Returns the calling layer.
setContent("content")	Sets the content of a layer. content is a string of HTML to be set. This can be accessed though the "innerHTML" property. Returns the calling layer.
holds(child)	Returns true if an element is a descendant of another element. child is the element to checked for containment.
insertElement ("id",width,"tag",index)	Creates and inserts a new hidden positioned element at the coordiates 0,0. id sets the layerName property(must be unique) of the element. width sets the true width of the element. tag sets the type of element (default is "DIV").... Netscape 4 will always insert a layer regardless of this setting. index a boolean value,if true,the element is not indexed. All parameters are optional. Returns the inserted element. Note:This is also a method of the window.
setEventHandler ("type",pointer,index)	Sets a event handler for a layer. Also see the event object's properties and methods. type is the type of event (eg "keypress"). pointer is a function (or null to cancel) to be assigned. index is the index number(default is 0) of the event handler. This allows multiply handlers to be set for a single event type. Note: This is also a method of window and document.
sendEvent(event)	Triggers an event for a layer. event is an event object. This object must have a type which has been registered using setEventHandler(). Note: This is also a method of window and document.
load("url",width)	Loads an external document and sets the width for a layer at the same time. This is a native method for layers in Netscape4. In other browsers this is used with iframe elements. url is the url of the document to be imported. width is the width of the document.
Layer Properties
layerObject.arrayIndex......returns a layer's index position in the allLayers array. layerObject.layerName......returns a layer's id or name attribute. layerObject.owner......returns the element to which the layer is attached during setup. layerObject.frameWindow......returns the layer's (iframe) window object or the layer itself. layerObject.page......returns the layer's (iframe) document object or the layer itself. layerObject.isNewLayer......returns "true" if a layer was created with insertElement(). layerObject.isNested......returns "true" if a layer is nested inside another layer. layerObject.next......returns the next layer in the document order(returns null if undefined). layerObject.previous......returns the previous layer in the document order(returns null if undefined). layerObject.nextLayer......returns a layer's next sibling(returns null if undefined). layerObject.previousLayer......returns a layer's previous sibling(returns null if undefined).
Layer Arrays
layerObject.images......A collection of the image elements a layer contains. layerObject.forms......A collection of the form elements a layer contains. layerObject.links......A collection of the link elements a layer contains. layerObject.cssLayers......An Array of the nested layers a layer contains.
Window Methods
pxHeight() pxWidth()	Returns the dimensions of the window's viewing area.
offsetLeft() offsetTop()	Returns how far the window has been scrolled.
selectedText()	Returns the selected text on a page.
Document Methods
pxHeight(integer) pxWidth(integer)	Returns the document's height/width. This can be set in Netscape 4 by using the parameter.
holds(child)	Returns true if an element is a descendant of the document. child is the element to checked for containment.
Document Properties
document.owner......the element the document is attached to during the setup. document.window......the parent window of the document. document.all......a collection of all the elements on the document (not available in Netscape 4).
allLayers & cssLayers Array Methods
addMethod ("name",pointer)	Allows a method to be added to all the layers in an array. name is the reference name to assign to the method. pointer is the function to be assigned.
Event Object Properties
The event object needs to be setup using the setupEvent() function. The setEventHandler() method runs this function automatically. The event object is passed to the handler via the first parameter. It has the following compatible properties: eventObject.clientX......returns a cursor's x-position relative to the viewing area. eventObject.clientY......returns a cursor's y-position relative to the viewing area. eventObject.pageX......returns a cursor's x-position relative to the document. eventObject.pageY......returns a cursor's y-position relative to the document. eventObject.screenX......returns a cursor's x-position relative to the screen. eventObject.screenY......returns a cursor's y-position relative to the screen. eventObject.click......returns which mouse button is pressed (left=1,middle=2,right=3). eventObject.key......returns the unicode value of the key pressed. eventObject.altKey......returns true if the Alt key is pressed. eventObject.ctrlKey......returns true if the Ctrl key is pressed. eventObject.shiftKey......returns true if the Shift key is pressed. eventObject.relatedElement...... returns the related target for mouseover and mouseout (n/a in Netscape 4). eventObject.time......returns the time in milliseconds since Jan.1,1970. eventObject.previous......returns the previous event object of the same type called by the same object eventObject.caller......returns the object which called the event handler. eventObject.window......returns the window where an event occurred. eventObject.type......returns the type of event.
Event Object Methods
getTarget(scope)	Returns the target object of an event. scope sets the scope of the event targeting with the values below. 0....returns the target as it would in Netscape 4 (default). 1....returns the actual target Element,Netscape 4 returns null. 2....returns only target textNodes in browsers that support it. Other browsers would return null. "layer".......returns the target Layer.
getPhase(scope)	Gets the current phase of an event and returns an integer. Returns 2 if the event is at the target,3 if the event is bubbling. scope sets the scope of the event phase. The arguments are the same as with getTarget().
stopPropagation()	Stops the event spreading (bubbling) to other objects.
getLayerX() getLayerY()	Returns the cursor's position relative to a layer.
Setup Functions
cbSetup("tagName")	The main setup function. This needs to be called after the page is loaded. tagName is a tagName of the elements to be indexed in non-Netscape 4 browsers (default is "DIV").
setupFrame(frame,"tagName")	Similiar to cbSetup(),used for setting up secondary frames/iframes/windows. frame is the frame to be setup,this could be a name(a string) of an iframe. It can also be a actual frame or external window. tagName is a tagName of the elements to be indexed in non-Netscape 4 browsers (default is "DIV"). Returns the frame on which is setup is done.
setupCollection(collection)	Gives members of a collection the basic methods on the cbscript.js file. collection is the collection (eg document.links) to be setup. These collections are not indexed.
Other Functions
setupEvent(event)	Modifies the event object to make it compatible and adds several properties and methods. This function is used within an event handler that was not assigned using setEventHandler() (which runs it automatically). event the first argument of the event handler,which passes the event object. Returns the modified event object.
createEvent("type")	Creates a new event object. This object could be used with the sendEvent() method. type is the type of event. Returns the event object.
getParent(object,doc)	Returns an object's parent layer. For top level objects this returns the window (unless the 2nd parameter is used). object is the object for which the parent is to be retrieved. doc a boolean value,if true,returns the document as the parent of top level objects.
doNothing()	A dummy function which does nothing at all.
Foot Notes
¹ Percentages are based on the size of the document or window,whichever is larger.
² Some style properties may need to be set inline or via scripting before the value can be retrieved.