JavaScript - Manejo de capas con firefox

   
Vista:

Manejo de capas con firefox

Publicado por Pablo (1 intervención) el 01/08/2008 17:07:25
Buenas tardes,

Tengo una página web que hace aparecer/desaparecer una capa con el siguiente código:

function Over(object,value)
{
object.className='over';
if (value==0)
muestra_oculta('PIALayer');
if (value==1)
muestra_oculta('InfoLayer');
if (value==2)
muestra_oculta('ComuLayer');
}

function Out(object, value)
{
object.className='out';
if (value==0)
muestra_oculta('PIALayer');
if (value==1)
muestra_oculta('InfoLayer');
if (value==2)
muestra_oculta('ComuLayer');
}

function muestra_oculta(id)
{
if (document.getElementById)
{
var el = document.getElementById(id);
el.style.display = (el.style.display == 'none') ? 'block' : 'none';
}
}

La función Over y Out se llaman desde un ONMOUSEOVER y un ONMOUSEOUT.

El caso es que desde internet Explorer funciona perfectamente pero no así en Firefox que no hace absolutamente nada. ¿Alguien puede orientarme?

Un saludo.
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de ScriptShow

RE:Manejo de capas con firefox

Publicado por ScriptShow (387 intervenciones) el 01/08/2008 21:19:54
Saludos Pablo,

no parece que tenga problema el código. He modificado algo para probar y, creo que es compatible con los nuevos navegadores.

Un ejemplo:

<html>
<head>
<style>
.over {color:blue;border:1px solid}
.out {color:cyan;border:1px solid}
</style>

<script type="text/javascript">
function Over(object,value)
{
object.className='over';
if (value==0)
muestra_oculta('PIALayer');
if (value==1)
muestra_oculta('InfoLayer');
if (value==2)
muestra_oculta('ComuLayer');
}

function Out(object, value)
{
object.className='out';
if (value==0)
muestra_oculta('PIALayer');
if (value==1)
muestra_oculta('InfoLayer');
if (value==2)
muestra_oculta('ComuLayer');
}

function muestra_oculta(id)
{
if (document.getElementById)
{
var el = document.getElementById(id);
el.style.display = (el.style.display == 'none') ? 'block' : 'none';
}
}
</script>
</head>

<body>

<div id="PIALayer" name="PIALayer" style="position:absolute;left:200px;display:none">CONTENIDO DE PIALAYER</div>

<div id="InfoLayer" name="InfoLayer" style="position:absolute;left:400px;display:none">CONTENIDO DE INFOLAYER</div>

<div id="ComuLayer" name="ComuLayer" style="position:absolute;left:600px;display:none">CONTENIDO DE COMULAYER</div>

<input type="button" value=" V e r " onmouseover="Over(this,0)" onmouseout="Out(this,0)">

<input type="button" value=" V e r " onmouseover="Over(this,1)" onmouseout="Out(this,1)">

<input type="button" value=" V e r " onmouseover="Over(this,2)" onmouseout="Out(this,2)">

</body>
</html>

De todas formas, hay otras opciones más sencillas para conseguir el mismo resultado. En fin, prueba a ver.

Espero te sea útil.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

RE:Manejo de capas con firefox

Publicado por Jorge Landa (1 intervención) el 24/03/2009 00:55:04
Yo uso esta función que me funciona bien en IE 7 y no funciona en Firefox 2 inclusive por más que he fijado el alto de las celdas donde he puesto las imágenes de las pestañas tiene también sus problemas:

function hide_infoejemplar(param)
{
if (param == "frame1") {
self.div_frame1.style.display='';
self.div_frame2.style.display='none';
self.div_frame3.style.display='none';
self.div_frame4.style.display='none';
}
if (param == "frame2") {
self.div_frame1.style.display='none';
self.div_frame2.style.display='';
self.div_frame3.style.display='none';
self.div_frame4.style.display='none';
}
if (param == "frame3") {
self.div_frame1.style.display='none';
self.div_frame2.style.display='none';
self.div_frame3.style.display='';
self.div_frame4.style.display='none';
}
if (param == "frame4") {
self.div_frame1.style.display='none';
self.div_frame2.style.display='none';
self.div_frame3.style.display='none';
self.div_frame4.style.display='';
}
}

y la invoco desde otro archivo así:
<a href="javascript:hide_infoejemplar('frame2');" class="tabEJ">
<p style="margin-top:8px; margin-bottom:0px; margin-left:0px; margin-right:0px">
Buscando Pareja
</p>
</a>

El ejemplo (prototipo) lo pueden ver en http://arrobadata.no-ip.info/bp/ y si alguien puede ayudarme se los agradeceré.

Gracias y saludos!
Jorge Landa
Lima - Perú
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar