Codigo PHP:
<script language="JavaScript">
seleccion = 0;
function menu1() {
if(seleccion != 1){
seleccion = 1;
obj1=document.getElementById("menu1");
obj2=document.getElementById("menu2");
obj3=document.getElementById("menu3");
obj4=document.getElementById("menu4");
obj5=document.getElementById("menu5");
obj6=document.getElementById("tabla_menu1");
obj7=document.getElementById("tabla_menu2");
obj8=document.getElementById("tabla_menu3");
obj9=document.getElementById("tabla_menu4");
objx=document.getElementById("tabla_menu5");
obj1.style.display="block";
obj2.style.display="none";
obj3.style.display="none";
obj4.style.display="none";
obj5.style.display="none";
obj6.className = "tabla_texto_1";
obj7.className = "tabla_texto_2";
obj8.className = "tabla_texto_2";
obj9.className = "tabla_texto_2";
objx.className = "tabla_texto_2";
}
}
function menu2() {
if(seleccion != 2){
seleccion = 2;
obj1=document.getElementById("menu1");
obj2=document.getElementById("menu2");
obj3=document.getElementById("menu3");
obj4=document.getElementById("menu4");
obj5=document.getElementById("menu5");
obj6=document.getElementById("tabla_menu1");
obj7=document.getElementById("tabla_menu2");
obj8=document.getElementById("tabla_menu3");
obj9=document.getElementById("tabla_menu4");
objx=document.getElementById("tabla_menu5");
obj1.style.display="none";
obj2.style.display="block";
obj3.style.display="none";
obj4.style.display="none";
obj5.style.display="none";
obj6.className = "tabla_texto_2";
obj7.className = "tabla_texto_1";
obj8.className = "tabla_texto_2";
obj9.className = "tabla_texto_2";
objx.className = "tabla_texto_2";
}
}
function menu3() {
if(seleccion != 3){
seleccion = 3;
obj1=document.getElementById("menu1");
obj2=document.getElementById("menu2");
obj3=document.getElementById("menu3");
obj4=document.getElementById("menu4");
obj5=document.getElementById("menu5");
obj6=document.getElementById("tabla_menu1");
obj7=document.getElementById("tabla_menu2");
obj8=document.getElementById("tabla_menu3");
obj9=document.getElementById("tabla_menu4");
objx=document.getElementById("tabla_menu5");
obj1.style.display="none";
obj2.style.display="none";
obj3.style.display="block";
obj4.style.display="none";
obj5.style.display="none";
obj6.className = "tabla_texto_2";
obj7.className = "tabla_texto_2";
obj8.className = "tabla_texto_1";
obj9.className = "tabla_texto_2";
objx.className = "tabla_texto_2";
}
}
function menu4() {
if(seleccion != 4){
seleccion = 4;
obj1=document.getElementById("menu1");
obj2=document.getElementById("menu2");
obj3=document.getElementById("menu3");
obj4=document.getElementById("menu4");
obj5=document.getElementById("menu5");
obj6=document.getElementById("tabla_menu1");
obj7=document.getElementById("tabla_menu2");
obj8=document.getElementById("tabla_menu3");
obj9=document.getElementById("tabla_menu4");
objx=document.getElementById("tabla_menu5");
obj1.style.display="none";
obj2.style.display="none";
obj3.style.display="none";
obj4.style.display="block";
obj5.style.display="none";
obj6.className = "tabla_texto_2";
obj7.className = "tabla_texto_2";
obj8.className = "tabla_texto_2";
obj9.className = "tabla_texto_1";
objx.className = "tabla_texto_2";
}
}
function menu5() {
if(seleccion != 5){
seleccion = 5;
obj1=document.getElementById("menu1");
obj2=document.getElementById("menu2");
obj3=document.getElementById("menu3");
obj4=document.getElementById("menu4");
obj5=document.getElementById("menu5");
obj6=document.getElementById("tabla_menu1");
obj7=document.getElementById("tabla_menu2");
obj8=document.getElementById("tabla_menu3");
obj9=document.getElementById("tabla_menu4");
objx=document.getElementById("tabla_menu5");
obj1.style.display="none";
obj2.style.display="none";
obj3.style.display="none";
obj4.style.display="none";
obj5.style.display="block";
obj6.className = "tabla_texto_2";
obj7.className = "tabla_texto_2";
obj8.className = "tabla_texto_2";
obj9.className = "tabla_texto_2";
objx.className = "tabla_texto_1";
}
}
</script>
<a name="menu"></a>
<table width='100%' border='0' bgcolor="#000000" cellpadding='5' cellspacing='1'>
<tr>
<td class='tabla_titulo' id='tabla_titulo_obj' colspan="5"><img src="https://espacioforos.miarroba.st/547950/blanco.gif" width="1" height="1" border="0" onLoad="menu1()">Menu
- <a href="http://miarroba.com/foros/ver.php?id=547950" target="_blank" style="text-decoration: none;">Gracias
a Skindario</a></td>
</tr>
<tr id='Tabla2_obj' class='tabla_texto_2'>
<td width="20%" align="center" valign="middle" onMouseOver="menu1()" id="tabla_menu1"><a href="#menu" style="text-decoration: none;">
Titulo Menu1 </a></td>
<td width="20%" align="center" valign="middle" onMouseOver="menu2()" id="tabla_menu2"><a href="#menu" style="text-decoration: none;">
Titulo Menu2</a></td>
<td width="20%" align="center" valign="middle" onMouseOver="menu3()" id="tabla_menu3"><a href="#menu" style="text-decoration: none;">
Titulo Menu3</a></td>
<td width="20%" align="center" valign="middle" onMouseOver="menu4()" id="tabla_menu4"><a href="#menu" style="text-decoration: none;">
Titulo Menu4</a></td>
<td width="20%" align="center" valign="middle" onMouseOver="menu5()" id="tabla_menu5"><a href="#menu" style="text-decoration: none;">
Titulo Menu5</a></td>
</tr>
<tr id='Tabla2_obj' class='tabla_texto_2'>
<td align="center" colspan="5" valign="middle">
<!--inicia codigo de Menu1 !-->
<div id="menu1" style="display:none;">Texto del Menu1</div>
<!--fin codigo de Menu1 e inicio codigo de Menu2!-->
<div id="menu2" style="display:none;">Texto del Menu2</div>
<!--fin codigo de Menu2 e inicio codigo de Menu3!-->
<div id="menu3" style="display:none;">Texto del Menu3</div>
<!--fin codigo de Menu3 e Inicio codigo Menu4!-->
<div id="menu4" style="display:none;">Texto del Menu4</div>
<!--fin codigo de Menu4 e inicio codigo de Menu5 !-->
<div id="menu5" style="display:none;">Texto del Menu5</div>
<!--fin codigo de Menu5!-->
</td>
</tr>
</table>
<br>
Es un menu que consta de 5 secciones y que segun se seleccione una u otra seccion, sale el contenido de esa seccion. El menu se adapta al estilo de cada foro sin necesidad de editarlo. Es compatible con todos los navegadores.
Para personalizar solo hay que cambiar lo siguiente:
Titulo Menu1, Titulo Menu2, Titulo Menu3, Titulo Menu4, Titulo Menu5
Por el titulo de cada menu, lo que habra que seleccionar para que salga su contenido.
Tambien habra que editar:
Texto del Menu1, Texto del Menu2, Texto del Menu3, Texto del Menu4, Texto del Menu5
Por el contenido de cada uno de los menus, lo que saldra al seleccionarlo.
Lo mejor es ir haciendo pruebas, podeis preguntar dudas. No se dara soporte a quien quite los agradecimientos.
Es la mejor alternativa a un menu desplegable, ademas de muy facil de editar.