Foros del Web - Ver Mensaje Individual

E*M*P*I*C*A*L · #2 (**permalink**) 13/05/2005, 02:25

Conseguí resolver el problema aunque no estoy muy seguro si la solución que dí al problema es la más elegante o la mejor. Si a alguien se le ocurre otra solución estaría bien que la compartiera :)

Código:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>

<script>
var M = new Array()
var nX = 0;
var caja = 0;
var abierto = 0;
var retardo = 5;
var aX = -100;

function MO(n)
{
this.is = caja[n];
this.clic = function() {
 with(this){
  sel = n;
	if (abierto){Cmenu(aX, sel);abierto = 0}
	else {Amenu(aX, sel);abierto = 1;}
	for (var k=0;k<caja.length;k++)
	 {
	  if (sel!=k)
		 {
	    bX = parseInt(M[k].is.style.left);
	    if (bX==0){Cmenu(aX, k);Amenu(aX, sel);}
		 }
	  }
	}
 }
}
onload = function()
{
 divs = document.getElementById("menu");
 caja= divs.getElementsByTagName("div")
 nX = caja.length;
 for (var i=0;i<nX;i++)
  {
	M[i] = new MO(i);
	}
}

function Amenu (aX, n)
{
 bX =parseInt(M[n].is.style.left)
 if (bX != 0)
  {
	 M[n].is.style.left=bX+2;
	 setTimeout('Amenu(' + aX + ',' + n + ')', retardo);
	}
}

function Cmenu (aX, n)
{
 bX =parseInt(M[n].is.style.left)
 if (bX != aX)
  {
	 M[n].is.style.left=bX-4;
	 setTimeout('Cmenu(' + aX + ',' + n + ')', retardo);
	}
}
</script>
<style>
a {
text-decoration:none;
font-family:helvetica;
font-weight:bold;
color:#000;
}
</style>
</head>
<body>
<menu id="menu">
<div onclick=M[0].clic() style="position:absolute;background-image:url(menu.gif);background-repeat:no-repeat;width:120px;height:100%;left:-100px;top:0;">
<br />
-<a href="#"> Capitulo 1</a><br />
-<a href="#"> Capitulo 2</a><br />
-<a href="#"> Capitulo 3</a><br />
-<a href="#"> Capitulo 4</a><br />
-<a href="#"> Capitulo 5</a><br />
-<a href="#"> Capitulo 6</a><br />
-<a href="#"> Capitulo 7</a><br />
<br />
</div>
<div onclick=M[1].clic() style="position:absolute;background-image:url(menu.gif);background-repeat:no-repeat;width:120px;height:100%;left:-100px;top:100px;">
<br />
-<a href="#"> Capitulo 1</a><br />
-<a href="#"> Capitulo 2</a><br />
-<a href="#"> Capitulo 3</a><br />
-<a href="#"> Capitulo 4</a><br />
-<a href="#"> Capitulo 5</a><br />
-<a href="#"> Capitulo 6</a><br />
-<a href="#"> Capitulo 7</a><br />
<br />
</div>
<div onclick=M[2].clic() style="position:absolute;background-image:url(menu.gif);background-repeat:no-repeat;width:120px;height:100%;left:-100px;top:200px;">
<br />
-<a href="#"> Capitulo 1</a><br />
-<a href="#"> Capitulo 2</a><br />
-<a href="#"> Capitulo 3</a><br />
-<a href="#"> Capitulo 4</a><br />
-<a href="#"> Capitulo 5</a><br />
-<a href="#"> Capitulo 6</a><br />
-<a href="#"> Capitulo 7</a><br />
<br />
</div>
</menu>
</body>
</html>