Use this page to explore the "Document Object Model" (DOM) in different browsers.
Begin by selecting one of the examples from the drop-down
menu. The properties for that object will be displayed in alphabetical order. Extra links,
form elements and other objects have been included on this page for testing.
Remember that object properties are case-sensitive!
I used this page to develop a fix for Google Ads appearing over top of the navigation menus. Some Google Ads are using
a z-index of 2147483647, which is the MAXIMUM possible integer value! Since you CANNOT set a larger value,
the ads are basically saying "HAHA F*** YOU" to anything important on your website, like navigation menus or modal dialogs.
Once I understood what was happening, I wrote a function to show the z-index of every HTML element on the page.
As the loop runs, if any z-index is greater than 9999, it is reset to 1000. Click HERE to run the function
and see the results in the "Properties List" box, above. The FIRST time you run it, you'll see the results BEFORE any z-indexes are
changed. The Google Ads will be at the end of the list.
The blue box near the top of the page is a DIV that has been
placed using position:absolute and has also been clipped. It contains 4 links and
"Clipped" Object Example:
ID = blueBox
defined size = 90 x 40
content size = 100 x 96 (varies)
clipped size = 59 x 57