
13/10/2009, 08:57
|
 | | | Fecha de Ingreso: octubre-2008 Ubicación: Madrid
Mensajes: 495
Antigüedad: 16 años, 4 meses Puntos: 66 | |
Respuesta: menú y submenús con onfocus Hola angeldelolmo,
Seguro que con CSS se logra con mayor facilidad lo que tu quieres. De todas maneras puede que este ejemplo te llegue a valer:
-------------------------
//codigo js
var seccion1 = false;
var seccion2 = false;
var seccion3 = false;
function enfocar(caso)
{
switch(caso)
{
case 1:
document.getElementById('secc1').style.backgroundC olor='green';
document.getElementById('secc2').style.backgroundC olor='transparent';
document.getElementById('secc3').style.backgroundC olor='transparent';
break;
case 2:
document.getElementById('secc2').style.backgroundC olor='red';
document.getElementById('secc1').style.backgroundC olor='transparent';
document.getElementById('secc3').style.backgroundC olor='transparent';
break;
case 3:
document.getElementById('secc3').style.backgroundC olor='yellow';
document.getElementById('secc2').style.backgroundC olor='transparent';
document.getElementById('secc1').style.backgroundC olor='transparent';
break;
}
}
function comprobarFoco(caso)
{
var mantenerFoco = false;
if(!seccion1 && !seccion2 && !seccion3)
mantenerFoco = true;
switch(caso)
{
case 1:
if(mantenerFoco)
{document.getElementById('secc1').style.background Color='green';
document.getElementById('secc2').style.backgroundC olor='transparent';
document.getElementById('secc3').style.backgroundC olor='transparent';}
break;
case 2:
if(mantenerFoco)
{document.getElementById('secc2').style.background Color='red';
document.getElementById('secc1').style.backgroundC olor='transparent';
document.getElementById('secc3').style.backgroundC olor='transparent';}
break;
case 3:
if(mantenerFoco)
{document.getElementById('secc3').style.background Color='yellow';
document.getElementById('secc1').style.backgroundC olor='transparent';
document.getElementById('secc2').style.backgroundC olor='transparent';}
break;
}
}
-----------------------------------------
<!--etiquetas HTML-->
<input type="text" onfocus="seccion1 = true;enfocar(1);" onblur="seccion1 = false;comprobarFoco(1);" value="seccion1" id="secc1" /><br />
<input type="text" value="seccion1 1" id="secc1_1" /><br />
<input type="text" onfocus="seccion2 = true;enfocar(2);" onblur="seccion2 = false;comprobarFoco(2);" value="seccion2" id="secc2" /><br />
<input type="text" value="seccion2 1" id="secc2_1" /><br />
<input type="text" value="seccion2 2" id="secc2_2" /><br />
<input type="text" onfocus="seccion3 = true;enfocar(3);" onblur="seccion3 = false;comprobarFoco(3);" value="seccion3" id="secc3" /><br />
<input type="text" value="seccion3 1" id="secc3_1" /><br />
<input type="text" value="seccion3 2" id="secc3_2" /><br />
---------------------------------
Como no sabía que objetos son tus secciones he hecho cajas de texto (que es más fácil de ver el foco, jeje). Con este ejemplillo si pinchas en las secciones principales se encienden y no pierden el color hasta que no pinchas en otra sección principal.
Pruébalo a ver que te parece.
salu2 |