Helpful Information
 
 
Category: Web Design, HTML Reference and CSS
How to close a layer?: HTML, CSS, JavaScript, PHP

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!

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>










privacy (GDPR)