Intro: layers is Netscape for the group elements including DIV, SPAN, LAYER and ILAYER. The latter element is a cross between IFRAME and DIV.
Hi,
I have a DHTML widget that works in MSIE/Mozilla. The Javascript side of it works in NS4 but I cannot prevent the ILAYER from distorting the rest of the page.
NS4 supports CSS for layers but I'm having problems getting it to respond to styles. NS4 also support inline attributes like BGCOLOR= HEIGHT= WIDTH= TOP= LEFT= though these only work with LAYER and ILAYER.
I'm trying to jog your memories
Anyway.
I have a TABLE. The ILAYER should be positioned in or over one of the cells.
When that ILAYER has position:absolute, it takes up two spaces on the page, reserving the pos:relevant space but with the actual element appearing elsewhere.
When that ILAYER has position:relevant (default), it has the strange effect of making two images in the next cell disapear and although the visible part of the element is fine, the ivisible "clipped" region takes up space and distorts the page.
Does anyone know how to prevent the distortion?
The following snippet is intended for NS4 only. It will not work in MSIE/Mozilla.
----------
I'm willing to trade custom scripts for... [see profile]
Hi,
I have a DHTML widget that works in MSIE/Mozilla. The Javascript side of it works in NS4 but I cannot prevent the ILAYER from distorting the rest of the page.
NS4 supports CSS for layers but I'm having problems getting it to respond to styles. NS4 also support inline attributes like BGCOLOR= HEIGHT= WIDTH= TOP= LEFT= though these only work with LAYER and ILAYER.
I'm trying to jog your memories
Anyway.
I have a TABLE. The ILAYER should be positioned in or over one of the cells.
When that ILAYER has position:absolute, it takes up two spaces on the page, reserving the pos:relevant space but with the actual element appearing elsewhere.
When that ILAYER has position:relevant (default), it has the strange effect of making two images in the next cell disapear and although the visible part of the element is fine, the ivisible "clipped" region takes up space and distorts the page.
Does anyone know how to prevent the distortion?
The following snippet is intended for NS4 only. It will not work in MSIE/Mozilla.
Code:
<script>
var a;
if (!document.layers) document.getElementById('div').style.top=0;
function move(){
if (document.layers){
with (document){
layers.dev.moveBy(0,data.cntl.value);
layers.dev.clip.top=0-layers.dev.top;layers.dev.clip.height=100-(layers.dev.top/100);
}
} else {
document.getElementById('div').style.top=parseInt(document.getElementById('div').style.top)+parseInt(document.data.cntl.value);
}
if (document.data.cntl.value!='0') setTimeout('move()',10);
}
</script>
<body style="background-color:white;">
<br><br>
<form name="data">
<input type="button" width="20" value="up" onblur="data.cntl.value='0';" onclick="data.cntl.value='-1';move()">
<input type="button" width="20" value="down" onblur="data.cntl.value='0';" onclick="data.cntl.value='1';move()">
<input type="button" name="cntl" value="0">
<table bgcolor="black" border="0" cellpadding="1"><tr><td>
<table bgcolor="white" height="100" cellspacing="0" border="0">
<tr>
<td width="200">reserved</td>
<td width="100"><ilayer id="dev" clip=100,100 bgcolor=red height=100 width=100 left=0 top=0
src="document.html"></ilayer></td>
<td width="8"><input type="image" height="8" width="8" src="scroll_up.gif" onblur="data.cntl.value='0';"
onclick="data.cntl.value='-1';move()" onmouseover="this.src='scroll_upH.gif'" onmouseout="this.src='scroll_up.gif'"
border="0"><br>
<input type="image" height="8" width="8" src="scroll_dn.gif" onblur="data.cntl.value='0';"
onclick="data.cntl.value='1';move()" onmouseover="this.src='scroll_dnH.gif'" onmouseout="this.src='scroll_dn.gif'" border="0"></td>
</tr></table>
</td></tr></table>
</form>
</body>----------
I'm willing to trade custom scripts for... [see profile]