JavaScript Examples Bible - UserWorks Technologies

460
JavaScript Examples Bible: The Essential Companion to JavaScript Bible
3-2-1, 1-3-2, 2-2-2, and so on. Each time you enter one new value, check the actual
layers to see if their stacking order changed and how that affected the other properties
of all layers. Listing 31-20 in the JavaScript Bible shows how to achieve the
same action with IE5+ and NN6+ syntax.
Listing 31-9: Relationships Among zIndex, above, and below
Layer zIndex
function setZ(field) {
switch (field.name) {
case “top” :
document.top.zIndex = parseInt(field.value)
break
case “mid” :
document.middle.zIndex = parseInt(field.value)
break
case “bot” :
document.bottom.zIndex = parseInt(field.value)
}
showValues()
}
function showValues() {
document.layers[0].document.forms[0].bot.value = document.bottom.zIndex
document.layers[1].document.forms[0].mid.value = document.middle.zIndex
document.layers[2].document.forms[0].top.value = document.top.zIndex
document.layers[0].document.forms[0].above.value = (document.bottom.above) ?
document.bottom.above.name : “(none)”
document.layers[1].document.forms[0].above.value = (document.middle.above) ?
document.middle.above.name : “(none)”
document.layers[2].document.forms[0].above.value = (document.top.above) ?
document.top.above.name : “(none)”
document.layers[0].document.forms[0].below.value = (document.bottom.below) ?
document.bottom.below.name : “(none)”
document.layers[1].document.forms[0].below.value = (document.middle.below) ?
document.middle.below.name : “(none)”
document.layers[2].document.forms[0].below.value = (document.top.below) ?
document.top.below.name : “(none)”
}
Setting the layer.zIndex Property of Sibling Layers
Enter new zIndex values to see the effect on three layers.
document.layerObject.zIndex