[Javascript] Controlling layers

Wed Mar 21 19:06:48 CST 2001

Well, personally I think you'd be better off
writing the code yourself. Wouldn't somthing
like this work in ns 4.7?

<div id=div1>Div 1 content<1div>

<a onmouseover="showme('div1')" onmouseout="hideme('div1')"
href="http://www.taiwanho.com/"><img src="line.jpg"></a>

<script language=javascript>
if (navigator.appName=="Microsoft Internet Explorer")
{nav="IE";
layerRef=".all";
styleRef=".style";}

if (navigator.appName=="Netscape")
{layerRef=".layers";
styleRef="";
nav="NS"}

function showme(myitem)
{
eval
("document"+layerRef+"['"+myitem+"']"+styleRef+".visibility='visible'");
}
function hideme(myitem)
{
eval ("document"+layerRef+"['"+myitem+"']"+styleRef+".visibility='hidden'");
}
</script>

ANdrew GIbson

-----Original Message-----
From: javascript-admin at LaTech.edu [mailto:javascript-admin at LaTech.edu]On
Behalf Of Malcolm
Sent: Thursday, March 22, 2001 12:21 PM
To: 'javascript at LaTech.edu'
Subject: [Javascript] Controlling layers

I am trying to add layered navigation menus to my site, and with help from
Dreamweaver managed to get the perfect results in IE (code included at the
bottom of this message).

My goal is to have a mouseover image that opens a layer. This layer then
remains visible until a mouseout on either the image or layer.

The trouble is with NS - although the mouseover makes the layer visible, the
layer becomes invisible when there is a mouseout from the image.

Can anyone give me advice on how to fix this?

Many thanks in advance.

Malcolm
malc at taiwanho.com
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript">
<!--
function MM_findObj(n, d) { //v3.0
var p,i,x; if(!d) d=document;
if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++)
x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++)
x=MM_findObj(n,d.layers[i].document); return x;
}
function MM_showHideLayers() { //v3.0
var i,p,v,obj,args=MM_showHideLayers.arguments;
for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null)
{ v=args[i+2];
if (obj.style) { obj=obj.style;
v=(v=='show')?'visible':(v='hide')?'hidden':v; }
obj.visibility=v; }
}
//-->
</script>
</head>
<body bgcolor="#FFFFFF">
<div onMouseOver="MM_showHideLayers('Layer1','','show')"
onMouseOut="MM_showHideLayers('Layer1','','hide')" id="Layer1"
style="position:absolute; left:44px; top:126px; width:148px; height:102px;
z-index:1; visibility: hidden; background-color: #FFCCCC;
layer-background-color: #FFCCCC; border: 1px none #000000"><a
href="http://www.taiwanho.com/">i
open</a> </div>
<a href="#" onMouseOver="MM_showHideLayers('Layer1','','show')"
onMouseOut="MM_showHideLayers('Layer1','','hide')"><img
src="pic.jpg" width="156" height="111"
border="0"></a>
</body>
</html>