PDA

View Full Version : How to close a layer?



NEWUSER
02 Oct 2005, 08:56 PM
I searched everywhere and cant find an answer
I have a layer that i'd like to be able to close using a hyperlink, is it possible? if so what is the code? Please let me know, thanks!

Rincewind
03 Oct 2005, 09:18 AM
And for those who speek english...

You use the visibility:hidden and visibility:show property in the css. A bit of javascript in your link will show and hide the layer. You can use an onClick event if you want however it's most commonly used for popup menus where you just mouseover the link to show/hide the layer using onmouseover and onmouseout events.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<style type="text/css">
.content {
background-color:#CCCCCC;
position: absolute;
height: 398px;
width: 230px;
top: 117px;
right: 29px;
visibility: hidden;
z-index: 5;
}
</style>

<script language="JavaScript" type="text/JavaScript">
<!--
function MM_findObj(n, d) { //v4.01
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);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_changeProp(objName,x,theProp,theValue) { //v6.0
var obj = MM_findObj(objName);
if (obj && (theProp.indexOf("style.")==-1 || obj.style)){
if (theValue == true || theValue == false)
eval("obj."+theProp+"="+theValue);
else eval("obj."+theProp+"='"+theValue+"'");
}
}


function MM_showHideLayers() { //v6.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>
<div id="contentone" class="content">
<p style="float:right; margin:0px 0px 3px 3px; padding:0px" ><a href="" onClick="MM_showHideLayers('contentone','','hide');return false;">[close]</a></p>
<p>some text or stuff here</p>
</div>

</body>
</html>