Click to See Complete Forum and Search --> : accessing an image in a layer in Netscape 4


byrdley20
08-26-2003, 02:51 PM
I am having trouble accessing an image that is within a layer in Netscape 4. I have searched all over and found that the common solution is using:

document.layers["layer1"].document.images["contactus"].src

I tried this but I get the error:

document.layers.layer1.document.images.contactus has no
properties.

Here is some code. Can someone please help me.

function showLayer2()
{
if(document.getElementById)
{
document.getElementById("layer2").style.visibility = 'visible';
}
else if(document.layers)
{
document.layers["layer2"].visibility = 'visible';

alert(document.layers["layer1"].document.images["contactus"].src);

}
}

function hideLayer2()
{
if(document.getElementById)
{
document.getElementById("layer2").style.visibility = 'hidden';
}
else if(document.layers)
{
document.layers["layer2"].visibility = 'hidden';
}
}

And here is the html:

<layer name="layer1">
<div id="layer1" style="position:absolute;">
<a href = "#"><img src=../images/menutools_signout.gif border="0" name="signout"></a>

<a href="#" onMouseOver="showLayer2()" onMouseOut="hideLayer2()"><img src=../images/menutools_contactus.gif border="0" name="contactus"></a>
</div>
</layer>

<layer name="layer2">
<div id="layer2" style="position:absolute; width:90; text-color:#003399; border:1px solid; background:#F5F5E1" onMouseOver="showLayer2()" onMouseOut="hideLayer2()">
<table width="100%" cellpadding="3" cellspacing="0">
<tr>
<td valign="center" style="width:100%; background-color:#F5F5E1" onMouseOver="this.style.backgroundColor='white';" onMouseOut="this.style.backgroundColor='#F5F5E1';">
<span class="subMenu">
<a href = "email" style="font-size:12px;" target="_blank">E-mail Us</a>
</span>
</td>
</tr>
<tr>
<td valign="center" style="width:100%; background-color:#F5F5E1" onMouseOver="this.style.backgroundColor='white';" onMouseOut="this.style.backgroundColor='#F5F5E1';">
<span class="subMenu">
<a href = "survey" style="font-size:12px;" target="_blank">Survey</a>
</span>
</td>
</tr>
</table>
</div>
</layer>

Please help me. Thank you.

pyro
08-26-2003, 03:28 PM
Why not just referece it with the images array? Take a look at this little example:

<script type="text/javascript">
function test() {
alert (document.images["myimg"].src);
}
onload = test;
</script>
</head>
<body>
<img src="test.gif" name="myimg" alt="test image">

byrdley20
08-26-2003, 03:33 PM
I have to access it throught the layer because the image is within a layer.

pyro
08-26-2003, 03:44 PM
Shouldn't matter:

<script type="text/javascript">
function test() {
alert (document.images["myimg"].src);
}
onload = test;
</script>
</head>
<body>
<layer id="testlayer">
<img src="test.gif" name="myimg">
</layer>Also, you do realize the <layer> is Netscape proprietary crap, right?

byrdley20
08-26-2003, 03:50 PM
I can't access it with just document.images[].src
I get a "has no properties" error.

The problem I seem to be having is mixing the <layer> and <div> tags, but I can't seem to get it to work yet.

dragle
08-27-2003, 08:54 AM
Hiya,

In NS4.x, absolutely positioned objects are represented internally as layers; so when you do this:


<layer name="layer1">
<div id="innerLayer1" style="position:absolute blah blah blah">
content here
</div>
</layer>


You're actually creating a nested layer, innerLayer1 inside of layer1. If that's really what you want, then you would need to access the innerLayer1 via something clumsy like this:


imgs = document.layers["layer1"].document.layers["innerLayer1"].document.images;


But I'd recommend just dropping the layer tags entirely and just going with
div tags, then you should be able to access the images as you mentioned.

Cheers!

gil davis
08-27-2003, 08:55 AM
<div id="layer1" style="position:absolute;">
Any tag that you declare positioned becomes a layer. Therefore, you have yet another document layer in your tree. You can see that by selecting View|Page Info from the menu bar. So, the access requires another level:
document.layers["layer1"].document.layers["layer1"].document.images["contactus"].src

gil davis
08-27-2003, 09:00 AM
Originally posted by pyro
Shouldn't matter: ... Also, you do realize the <layer> is Netscape proprietary crap, right?
It *does* matter. The Netscape DOM 0 creates a document array for each layer, and each document has it's own images array. You just have to realize/accept that document.layers is not the same as document.all (Micro$oft proprietary crap). ;-)

pyro
08-27-2003, 09:38 AM
Originally posted by gil davis
It *does* matter.Hmm... I thought I tested the code before I posted, but apparently not, as when I try it now in NN 4.7 it does not work. Sorry about that...

Originally posted by gil davis
document.all (Micro$oft proprietary crap).Agreed... ;)

gil davis
08-28-2003, 05:29 PM
Originally posted by pyro
Hmm... I thought I tested the code before I posted, but apparently not, as when I try it now in NN 4.7 it does not work. Sorry about thatActually, it wouldn't surprise me if it had, under certain conditions. NS 4 will sometimes break in extremely peculiar ways. Even the View|Page Info is sometimes misleading with layers.