problema al ocultar un div

otero · #1 (**permalink**) 26/06/2006, 11:42

Hola,
estoy intentando crear un div que se oculte y deje mas espacio al DIV que tiene el contenido pero este ultimo no se ve bien.
A ver si encontrais el problema o si hay otra manera de hacer esto.

Muchas gracias.

El cofigo:

Código HTML:

<HTML>
<HEAD>
<style>
#left_menu {
	position: absolute;
	left: 0px;
	padding: 4px;
	width: 200px; 
	height:660px;
	background-color:#f5f7f6;
	visibility:'';
}
	
#splitter_bar {
	background-color:red;
	position: absolute;
	left:201px;
	width =5px;
	height: 660px;
}
	
#content {
	left:207px;
	margin-right:0px;
	margin-botton:0px;
	height: 660px;
	background-color:orange;

}
	
</style>

<SCRIPT LANGUAGE="JavaScript">

function hb() //Show or hide the left_menu
{

	if(document.all['left_menu'].style.visibility == 'hidden')
	{
		document.all['left_menu'].style.visibility = '';
		document.all['splitter_bar'].style.position = 'absolute';
		document.all['splitter_bar'].style.left = '201px';
		
		document.all['content'].style.left = '206px';

	
	}
	else
	{
		document.all['left_menu'].style.visibility = 'hidden';
		document.all['splitter_bar'].style.position = 'absolute';
		document.all['splitter_bar'].style.left = '0px';
		
		document.all['content'].style.left = '6px';
		
	}
}
</SCRIPT>
</HEAD>
<body>


<div id="left_menu">
left menu	
</div>


<div id=splitter_bar>
	<a href="javascript:hb();"><<</a>
</div>

<div id="content">
	<table border=0 width=400 align=left>
	<tr><td>content</td><td>content</td><td>content</td><td>content</td></tr>
	<tr><td>content</td><td>content</td><td>content</td><td>content</td></tr>
	<tr><td>content</td><td>content</td><td>content</td><td>content</td></tr>
	<tr><td>content</td><td>content</td><td>content</td><td>content</td></tr>
	</table>
</div>



</body>
</html>

eddygonzalez2000 · #2 (**permalink**) 28/06/2006, 21:01

yo soy nuevo en esto pero talvez si haces una funcion que vuelva a escribir todo el div del content cada vez que se presiona el link <<

EdiWorks · #3 (**permalink**) 29/06/2006, 10:32

Tienes errores en el código CSS:
En #left_menu si quieres 'desaparecer' ese bloque, es posible usar el estilo:
display:none;
eso de visibility:''; ?

En el #splitter_bar hay error de sintaxis en la linea width =5px;, NO se debe usar '=' sino ':', es decir debe quedar:
width: 5px;

Por lo menos por sintaxis el código no te funciona en varias partes, deberías darle una revisada a documentación sobre CSS, en www.w3schools.com encuentras buena información, aunque imagino que aquí debe haber muchísima información al respeto. Saludos.