¿Por que no me funciona el javascript en firefox?
Estoy haciendo una pagina web y he hecho un menu con javascript, pero no consigo que funcione en FIREFOX, en IE, en safari, chrome me funciona. Pero me tiene que funcionar en firefox ya que es uno de los que mas se usan. ¿Veis algun fallo o me falta algo?.
lo que tengo en el head//
lo que tengo en el head//
<script language="javascript" type="text/javascript"> <!-- function cambiar () { if (mercsub.style.visibility == "hidden")//Especificamos la propiedad de visibilidad de la Capa1 { mercsub.style.visibility = "visible"; submenuaudi.style.visibility = "hidden"; submenubmw.style.visibility = "hidden"; submenuotros.style.visibility = "hidden"; mercsub.style.left = merc.style.left + merc.style.width;//Asignamos la posición de la capa absoluta mercsub.style.top = merc.style.top + 130; } else { mercsub.style.visibility = "hidden"; } } //--> </script> <!-- FIN JAVASCRIPT PARA EL MENU MERCEDES--> lo que tengo en el body <!--MENU MERCEDES, AUDI, BMW Y OTROS--> <div id="lateral"> <div id="merc" style="position:relative; width:126px; height:54px; margin-top:10px; background-image:url(images/menumercedesoscuro.jpg); "onClick="cambiar();"> </div>
1 respuesta
Respuesta de krlosnow
1
1
krlosnow, Mas de 15 años de experiencia en Java, Javascript y HTML
Te agradecería que copiases todos los divs que tienes en el body, para poder probar el script.
te pongo el codigo completo de la pagina.
<!-- INICIO JAVASCRIPT PARA EL MENU MERCEDES-->
<script language="javascript" type="text/javascript">
<!--
function cambiar ()
{
if (mercsub.style.visibility == "hidden")//Especificamos la propiedad de visibilidad de la Capa1
{
mercsub.style.visibility = "visible";
submenuaudi.style.visibility = "hidden";
submenubmw.style.visibility = "hidden";
submenuotros.style.visibility = "hidden";
mercsub.style.left = merc.style.left + merc.style.width;//Asignamos la posición de la capa absoluta
mercsub.style.top = merc.style.top + 130;
} else {
mercsub.style.visibility = "hidden";
}
}
//-->
</script>
<!-- FIN JAVASCRIPT PARA EL MENU MERCEDES-->
<!-- INICIO JAVASCRIPT PARA EL MENU AUDI-->
<script language="javascript" type="text/javascript">
<!--
function cambiaraudi ()
{
if (submenuaudi.style.visibility == "hidden")//Especificamos la propiedad de visibilidad de la Capa1
{
submenuaudi.style.visibility = "visible";
mercsub.style.visibility = "hidden";
submenubmw.style.visibility = "hidden";
submenuotros.style.visibility = "hidden";
submenuaudi.style.left = menuaudi.style.left + menuaudi.style.width;//Asignamos la posición de la capa absoluta
submenuaudi.style.top = menuaudi.style.top + 117;
} else {
submenuaudi.style.visibility = "hidden";
}
}
//-->
</script>
<!-- FIN JAVASCRIPT PARA EL MENU AUDI-->
<!-- INICIO JAVASCRIPT PARA EL MENU BMW-->
<script language="javascript" type="text/javascript">
<!--
function cambiarbmw ()
{
if (submenubmw.style.visibility == "hidden")//Especificamos la propiedad de visibilidad de la Capa1
{
submenubmw.style.visibility = "visible";
mercsub.style.visibility = "hidden";
submenuaudi.style.visibility = "hidden";
submenuotros.style.visibility = "hidden";
submenubmw.style.left = menubmw.style.left + menubmw.style.width;//Asignamos la posición de la capa absoluta
submenubmw.style.top = menubmw.style.top + 119;
} else {
submenubmw.style.visibility = "hidden";
}
}
//-->
</script>
<!-- FIN JAVASCRIPT PARA EL MENU BMW-->
<!-- INICIO JAVASCRIPT PARA EL MENU OTROS-->
<script language="javascript" type="text/javascript">
<!--
function cambiarotros ()
{
if (submenuotros.style.visibility == "hidden")//Especificamos la propiedad de visibilidad de la Capa1
{
submenuotros.style.visibility = "visible";
mercsub.style.visibility = "hidden";
submenuaudi.style.visibility = "hidden";
submenubmw.style.visibility = "hidden";
submenuotros.style.left = menuotros.style.left + menuotros.style.width;//Asignamos la posición de la capa absoluta
submenuotros.style.top = menuotros.style.top + 117;
} else {
submenuotros.style.visibility = "hidden";
}
}
//-->
</script>
<!-- FIN JAVASCRIPT PARA EL MENU BMW-->
<!-- InstanceEndEditable -->
<link href="css/estilos.css" rel="stylesheet" type="text/css" />
<!-- InstanceBeginEditable name="head" -->
<style type="text/css">
<!--
#apDiv1 {
position:absolute;
width:642px;
height:436px;
z-index:5;
left: 342px;
top: 134px;
}
-->
</style>
<!-- InstanceEndEditable -->
</head>
<body>
<div id="contenedor">
<div id="cabecera"></div>
<div id="menu">
<ul class="menu">
<li><a href="#">HOME</a></li>
|
<li><a href="#">MODELOS</a></li>
|
<li><a href="#">SERVICIO POST-VENTA</a></li>
|
<li><a href="#">EMPRESA</a></li>
|
<li><a href="#">CONTACTO</a></li>
|
</ul>
</div>
<div id="contenido"><!-- InstanceBeginEditable name="EditRegion3" -->
<!--MENU MERCEDES, AUDI, BMW Y OTROS-->
<div id="lateral">
<div id="merc" style="position:relative; width:126px; height:54px; margin-top:10px; background-image:url(images/menumercedesoscuro.jpg);
"onClick="cambiar();">
</div>
<div id="menuaudi" style="position:relative; width:126px; height:54px; background-image:url(images/menuaudioscuro.jpg);
"onClick="cambiaraudi();">
</div>
<div id="menubmw" style="position:relative; width:126px; height:54px; background-image:url(images/menubmwoscuro.jpg);
"onClick="cambiarbmw();">
</div>
<div id="menuotros" style="position:relative; width:126px; height:54px; background-image:url(images/menuotrososcuro.jpg);
"onClick="cambiarotros();">
</div>
</div>
<!-- FIN MENU MERCEDES, AUDIO, BMW Y OTROS-->
<!-- capas posicion absoluta MERCEDES,AUDI, BMW Y OTROS-->
<div id="mercsub" style="position:absolute; z-index:1; left: 150px; top: 139px; width:223px; height:100%; visibility: hidden;">
<ul class="modelos">
<li><a href="paginas/mercedes/clasecberlina.html" target="frame">CLASE C BERLINA</a></li>
<li><a href="paginas/mercedes/claseclcoupeoupe.html" target="frame"class="par">CLASE CL COUPE</a></li>
<li><a href="paginas/mercedes/clasersport.html" target="frame">CLASE R SPORT TOURER</a></li>
<li><a href="paginas/mercedes/claseglk.html" target="frame" class="par">CLASE GLK</a></li>
<li><a href="paginas/mercedes/claseslsamg.html" target="frame">CLASE SLS AMG</a></li>
</ul>
</div>
<div id="submenuaudi" style="position:absolute; z-index:2; left: 147px; top: 340px; width:201px; height:100%;">
<ul class="modelos">
<li><a href="paginas/audi/audia3.html" target="frame">A3</a></li>
<li><a href="paginas/audi/audia3sport.html" target="frame" class="par">A3 SPORTBACK</a></li>
<li><a href="paginas/audi/audia4avant.html" target="frame">A4 AVANT</a></li>
<li><a href="paginas/audi/audia5cabrio.html" target="frame" class="par">A5 CABRIO</a></li>
<li><a href="paginas/audi/audiq5.html" target="frame">Q5</a></li>
<li><a href="paginas/audi/audiq7.html" target="frame" class="par">Q7</a></li>
</ul>
</div>
<div id="submenubmw" style="position:absolute; z-index:3; left: 145px; top: 229px; width:223px; height:100%;">
<ul class="modelos">
<li><a href="paginas/bmw/bmws3berlina.html" target="frame">SERIE 3 BERLINA</a></li>
<li><a href="paginas/bmw/bmwserie6cabrio.html" target="frame" class="par">SERIE 6 CABRIO</a></li>
<li><a href="paginas/bmw/bmwserie7.html" target="frame">SERIE 7 HIGHT SECURITY</a></li>
<li><a href="paginas/bmw/bmwx5.html" target="frame" class="par">X5</a></li>
<li><a href="paginas/bmw/bmwx6.html" target="frame">X6</a></li>
<li><a href="paginas/bmw/bmwm3coupe.html" target="frame" class="par">M3 COUPE</a></li>
</ul>
</div>
<div id="submenuotros" style="position:absolute; z-index:4; left: 157px; top: 495px; width:223px; height:100%;">
<ul class="modelos">
<li><a href="#">---</a></li>
<li><a href="#" class="par">---</a></li>
<li><a href="#">---</a></li>
<li><a href="#" class="par">---</a></li>
<li><a href="#">---</a></li>
<li><a href="#" class="par">---</a></li>
</ul>
</div>
<!-- fin capas posicion absoluta MERCEDES,AUDI, BMW Y OTROS-->
<div id="iframe">
<iframe src="paginas/base.html" width="680px" height="460px" frameborder="0" scrolling="no" name="frame"></iframe>
</div>
<!-- InstanceEndEditable --></div>
<div id="pie"></div>
</div>
</body>
<!-- InstanceEnd -->
</html>
<!-- INICIO JAVASCRIPT PARA EL MENU MERCEDES-->
<script language="javascript" type="text/javascript"> <!--
function cambiar () { if (mercsub.style.visibility == "hidden")//Especificamos la propiedad de visibilidad de la Capa1 { mercsub.style.visibility = "visible"; submenuaudi.style.visibility = "hidden"; submenubmw.style.visibility = "hidden"; submenuotros.style.visibility = "hidden"; mercsub.style.left = merc.style.left + merc.style.width;//Asignamos la posición de la capa absoluta mercsub.style.top = merc.style.top + 130; } else { mercsub.style.visibility = "hidden"; } }
//--> </script>
<!-- FIN JAVASCRIPT PARA EL MENU MERCEDES--> <!-- INICIO JAVASCRIPT PARA EL MENU AUDI-->
<script language="javascript" type="text/javascript"> <!--
function cambiaraudi () { if (submenuaudi.style.visibility == "hidden")//Especificamos la propiedad de visibilidad de la Capa1 { submenuaudi.style.visibility = "visible"; mercsub.style.visibility = "hidden"; submenubmw.style.visibility = "hidden"; submenuotros.style.visibility = "hidden"; submenuaudi.style.left = menuaudi.style.left + menuaudi.style.width;//Asignamos la posición de la capa absoluta submenuaudi.style.top = menuaudi.style.top + 117; } else { submenuaudi.style.visibility = "hidden"; } }
//--> </script>
<!-- FIN JAVASCRIPT PARA EL MENU AUDI-->
<!-- INICIO JAVASCRIPT PARA EL MENU BMW-->
<script language="javascript" type="text/javascript"> <!--
function cambiarbmw () { if (submenubmw.style.visibility == "hidden")//Especificamos la propiedad de visibilidad de la Capa1 { submenubmw.style.visibility = "visible"; mercsub.style.visibility = "hidden"; submenuaudi.style.visibility = "hidden"; submenuotros.style.visibility = "hidden"; submenubmw.style.left = menubmw.style.left + menubmw.style.width;//Asignamos la posición de la capa absoluta submenubmw.style.top = menubmw.style.top + 119; } else { submenubmw.style.visibility = "hidden"; } }
//--> </script>
<!-- FIN JAVASCRIPT PARA EL MENU BMW-->
<!-- INICIO JAVASCRIPT PARA EL MENU OTROS-->
<script language="javascript" type="text/javascript"> <!--
function cambiarotros () { if (submenuotros.style.visibility == "hidden")//Especificamos la propiedad de visibilidad de la Capa1 { submenuotros.style.visibility = "visible"; mercsub.style.visibility = "hidden"; submenuaudi.style.visibility = "hidden"; submenubmw.style.visibility = "hidden"; submenuotros.style.left = menuotros.style.left + menuotros.style.width;//Asignamos la posición de la capa absoluta submenuotros.style.top = menuotros.style.top + 117; } else { submenuotros.style.visibility = "hidden"; } }
//--> </script>
<!-- FIN JAVASCRIPT PARA EL MENU BMW--><!-- InstanceEndEditable -->
<link href="css/estilos.css" rel="stylesheet" type="text/css" />
<!-- InstanceBeginEditable name="head" -->
<style type="text/css"><!--#apDiv1 {position:absolute;width:642px;height:436px;z-index:5;left: 342px;top: 134px;}--></style>
<!-- InstanceEndEditable -->
</head>
<body>
<div id="contenedor">
<div id="cabecera"></div>
<div id="menu">
<ul class="menu">
<li><a href="#">HOME</a></li>
|
<li><a href="#">MODELOS</a></li>
|
<li><a href="#">SERVICIO POST-VENTA</a></li>
|
<li><a href="#">EMPRESA</a></li>
|
<li><a href="#">CONTACTO</a></li>
|
</ul>
</div>
<div id="contenido"><!-- InstanceBeginEditable name="EditRegion3" --> <!--MENU MERCEDES, AUDI, BMW Y OTROS-->
<div id="lateral">
<div id="merc" style="position:relative; width:126px; height:54px; margin-top:10px; background-image:url(images/menumercedesoscuro.jpg); "onClick="cambiar();"> </div>
<div id="menuaudi" style="position:relative; width:126px; height:54px; background-image:url(images/menuaudioscuro.jpg); "onClick="cambiaraudi();"> </div>
<div id="menubmw" style="position:relative; width:126px; height:54px; background-image:url(images/menubmwoscuro.jpg); "onClick="cambiarbmw();"> </div>
<div id="menuotros" style="position:relative; width:126px; height:54px; background-image:url(images/menuotrososcuro.jpg); "onClick="cambiarotros();"> </div>
</div>
<!-- FIN MENU MERCEDES, AUDIO, BMW Y OTROS-->
<!-- capas posicion absoluta MERCEDES,AUDI, BMW Y OTROS-->
<div id="mercsub" style="position:absolute; z-index:1; left: 150px; top: 139px; width:223px; height:100%; visibility: hidden;">
<ul class="modelos">
<li><a href="paginas/mercedes/clasecberlina.html" target="frame">CLASE C BERLINA</a></li>
<li><a href="paginas/mercedes/claseclcoupeoupe.html" target="frame"class="par">CLASE CL COUPE</a></li>
<li><a href="paginas/mercedes/clasersport.html" target="frame">CLASE R SPORT TOURER</a></li>
<li><a href="paginas/mercedes/claseglk.html" target="frame" class="par">CLASE GLK</a></li>
<li><a href="paginas/mercedes/claseslsamg.html" target="frame">CLASE SLS AMG</a></li>
</ul>
</div>
<div id="submenuaudi" style="position:absolute; z-index:2; left: 147px; top: 340px; width:201px; height:100%;">
<ul class="modelos">
<li><a href="paginas/audi/audia3.html" target="frame">A3</a></li>
<li><a href="paginas/audi/audia3sport.html" target="frame" class="par">A3 SPORTBACK</a></li>
<li><a href="paginas/audi/audia4avant.html" target="frame">A4 AVANT</a></li>
<li><a href="paginas/audi/audia5cabrio.html" target="frame" class="par">A5 CABRIO</a></li>
<li><a href="paginas/audi/audiq5.html" target="frame">Q5</a></li>
<li><a href="paginas/audi/audiq7.html" target="frame" class="par">Q7</a></li>
</ul>
</div>
<div id="submenubmw" style="position:absolute; z-index:3; left: 145px; top: 229px; width:223px; height:100%;">
<ul class="modelos">
<li><a href="paginas/bmw/bmws3berlina.html" target="frame">SERIE 3 BERLINA</a></li>
<li><a href="paginas/bmw/bmwserie6cabrio.html" target="frame" class="par">SERIE 6 CABRIO</a></li>
<li><a href="paginas/bmw/bmwserie7.html" target="frame">SERIE 7 HIGHT SECURITY</a></li>
<li><a href="paginas/bmw/bmwx5.html" target="frame" class="par">X5</a></li>
<li><a href="paginas/bmw/bmwx6.html" target="frame">X6</a></li>
<li><a href="paginas/bmw/bmwm3coupe.html" target="frame" class="par">M3 COUPE</a></li>
</ul>
</div>
<div id="submenuotros" style="position:absolute; z-index:4; left: 157px; top: 495px; width:223px; height:100%;">
<ul class="modelos">
<li><a href="#">---</a></li>
<li><a href="#" class="par">---</a></li>
<li><a href="#">---</a></li>
<li><a href="#" class="par">---</a></li>
<li><a href="#">---</a></li>
<li><a href="#" class="par">---</a></li>
</ul>
</div>
<!-- fin capas posicion absoluta MERCEDES,AUDI, BMW Y OTROS-->
<div id="iframe"> <iframe src="paginas/base.html" width="680px" height="460px" frameborder="0" scrolling="no" name="frame"></iframe></div>
<!-- InstanceEndEditable --></div>
<div id="pie"></div>
</div>
</body>
<!-- InstanceEnd -->
</html>
<!-- INICIO JAVASCRIPT PARA EL MENU MERCEDES-->
<script language="javascript" type="text/javascript">
<!--
function cambiar ()
{
if (mercsub.style.visibility == "hidden")//Especificamos la propiedad de visibilidad de la Capa1
{
mercsub.style.visibility = "visible";
submenuaudi.style.visibility = "hidden";
submenubmw.style.visibility = "hidden";
submenuotros.style.visibility = "hidden";
mercsub.style.left = merc.style.left + merc.style.width;//Asignamos la posición de la capa absoluta
mercsub.style.top = merc.style.top + 130;
} else {
mercsub.style.visibility = "hidden";
}
}
//-->
</script>
<!-- FIN JAVASCRIPT PARA EL MENU MERCEDES-->
<!-- INICIO JAVASCRIPT PARA EL MENU AUDI-->
<script language="javascript" type="text/javascript">
<!--
function cambiaraudi ()
{
if (submenuaudi.style.visibility == "hidden")//Especificamos la propiedad de visibilidad de la Capa1
{
submenuaudi.style.visibility = "visible";
mercsub.style.visibility = "hidden";
submenubmw.style.visibility = "hidden";
submenuotros.style.visibility = "hidden";
submenuaudi.style.left = menuaudi.style.left + menuaudi.style.width;//Asignamos la posición de la capa absoluta
submenuaudi.style.top = menuaudi.style.top + 117;
} else {
submenuaudi.style.visibility = "hidden";
}
}
//-->
</script>
<!-- FIN JAVASCRIPT PARA EL MENU AUDI-->
<!-- INICIO JAVASCRIPT PARA EL MENU BMW-->
<script language="javascript" type="text/javascript">
<!--
function cambiarbmw ()
{
if (submenubmw.style.visibility == "hidden")//Especificamos la propiedad de visibilidad de la Capa1
{
submenubmw.style.visibility = "visible";
mercsub.style.visibility = "hidden";
submenuaudi.style.visibility = "hidden";
submenuotros.style.visibility = "hidden";
submenubmw.style.left = menubmw.style.left + menubmw.style.width;//Asignamos la posición de la capa absoluta
submenubmw.style.top = menubmw.style.top + 119;
} else {
submenubmw.style.visibility = "hidden";
}
}
//-->
</script>
<!-- FIN JAVASCRIPT PARA EL MENU BMW-->
<!-- INICIO JAVASCRIPT PARA EL MENU OTROS-->
<script language="javascript" type="text/javascript">
<!--
function cambiarotros ()
{
if (submenuotros.style.visibility == "hidden")//Especificamos la propiedad de visibilidad de la Capa1
{
submenuotros.style.visibility = "visible";
mercsub.style.visibility = "hidden";
submenuaudi.style.visibility = "hidden";
submenubmw.style.visibility = "hidden";
submenuotros.style.left = menuotros.style.left + menuotros.style.width;//Asignamos la posición de la capa absoluta
submenuotros.style.top = menuotros.style.top + 117;
} else {
submenuotros.style.visibility = "hidden";
}
}
//-->
</script>
<!-- FIN JAVASCRIPT PARA EL MENU BMW-->
<!-- InstanceEndEditable -->
<link href="css/estilos.css" rel="stylesheet" type="text/css" />
<!-- InstanceBeginEditable name="head" -->
<style type="text/css">
<!--
#apDiv1 {
position:absolute;
width:642px;
height:436px;
z-index:5;
left: 342px;
top: 134px;
}
-->
</style>
<!-- InstanceEndEditable -->
</head>
<body>
<div id="contenedor">
<div id="cabecera"></div>
<div id="menu">
<ul class="menu">
<li><a href="#">HOME</a></li>
|
<li><a href="#">MODELOS</a></li>
|
<li><a href="#">SERVICIO POST-VENTA</a></li>
|
<li><a href="#">EMPRESA</a></li>
|
<li><a href="#">CONTACTO</a></li>
|
</ul>
</div>
<div id="contenido"><!-- InstanceBeginEditable name="EditRegion3" -->
<!--MENU MERCEDES, AUDI, BMW Y OTROS-->
<div id="lateral">
<div id="merc" style="position:relative; width:126px; height:54px; margin-top:10px; background-image:url(images/menumercedesoscuro.jpg);
"onClick="cambiar();">
</div>
<div id="menuaudi" style="position:relative; width:126px; height:54px; background-image:url(images/menuaudioscuro.jpg);
"onClick="cambiaraudi();">
</div>
<div id="menubmw" style="position:relative; width:126px; height:54px; background-image:url(images/menubmwoscuro.jpg);
"onClick="cambiarbmw();">
</div>
<div id="menuotros" style="position:relative; width:126px; height:54px; background-image:url(images/menuotrososcuro.jpg);
"onClick="cambiarotros();">
</div>
</div>
<!-- FIN MENU MERCEDES, AUDIO, BMW Y OTROS-->
<!-- capas posicion absoluta MERCEDES,AUDI, BMW Y OTROS-->
<div id="mercsub" style="position:absolute; z-index:1; left: 150px; top: 139px; width:223px; height:100%; visibility: hidden;">
<ul class="modelos">
<li><a href="paginas/mercedes/clasecberlina.html" target="frame">CLASE C BERLINA</a></li>
<li><a href="paginas/mercedes/claseclcoupeoupe.html" target="frame"class="par">CLASE CL COUPE</a></li>
<li><a href="paginas/mercedes/clasersport.html" target="frame">CLASE R SPORT TOURER</a></li>
<li><a href="paginas/mercedes/claseglk.html" target="frame" class="par">CLASE GLK</a></li>
<li><a href="paginas/mercedes/claseslsamg.html" target="frame">CLASE SLS AMG</a></li>
</ul>
</div>
<div id="submenuaudi" style="position:absolute; z-index:2; left: 147px; top: 340px; width:201px; height:100%;">
<ul class="modelos">
<li><a href="paginas/audi/audia3.html" target="frame">A3</a></li>
<li><a href="paginas/audi/audia3sport.html" target="frame" class="par">A3 SPORTBACK</a></li>
<li><a href="paginas/audi/audia4avant.html" target="frame">A4 AVANT</a></li>
<li><a href="paginas/audi/audia5cabrio.html" target="frame" class="par">A5 CABRIO</a></li>
<li><a href="paginas/audi/audiq5.html" target="frame">Q5</a></li>
<li><a href="paginas/audi/audiq7.html" target="frame" class="par">Q7</a></li>
</ul>
</div>
<div id="submenubmw" style="position:absolute; z-index:3; left: 145px; top: 229px; width:223px; height:100%;">
<ul class="modelos">
<li><a href="paginas/bmw/bmws3berlina.html" target="frame">SERIE 3 BERLINA</a></li>
<li><a href="paginas/bmw/bmwserie6cabrio.html" target="frame" class="par">SERIE 6 CABRIO</a></li>
<li><a href="paginas/bmw/bmwserie7.html" target="frame">SERIE 7 HIGHT SECURITY</a></li>
<li><a href="paginas/bmw/bmwx5.html" target="frame" class="par">X5</a></li>
<li><a href="paginas/bmw/bmwx6.html" target="frame">X6</a></li>
<li><a href="paginas/bmw/bmwm3coupe.html" target="frame" class="par">M3 COUPE</a></li>
</ul>
</div>
<div id="submenuotros" style="position:absolute; z-index:4; left: 157px; top: 495px; width:223px; height:100%;">
<ul class="modelos">
<li><a href="#">---</a></li>
<li><a href="#" class="par">---</a></li>
<li><a href="#">---</a></li>
<li><a href="#" class="par">---</a></li>
<li><a href="#">---</a></li>
<li><a href="#" class="par">---</a></li>
</ul>
</div>
<!-- fin capas posicion absoluta MERCEDES,AUDI, BMW Y OTROS-->
<div id="iframe">
<iframe src="paginas/base.html" width="680px" height="460px" frameborder="0" scrolling="no" name="frame"></iframe>
</div>
<!-- InstanceEndEditable --></div>
<div id="pie"></div>
</div>
</body>
<!-- InstanceEnd -->
</html>
<!-- INICIO JAVASCRIPT PARA EL MENU MERCEDES-->
<script language="javascript" type="text/javascript"> <!--
function cambiar () { if (mercsub.style.visibility == "hidden")//Especificamos la propiedad de visibilidad de la Capa1 { mercsub.style.visibility = "visible"; submenuaudi.style.visibility = "hidden"; submenubmw.style.visibility = "hidden"; submenuotros.style.visibility = "hidden"; mercsub.style.left = merc.style.left + merc.style.width;//Asignamos la posición de la capa absoluta mercsub.style.top = merc.style.top + 130; } else { mercsub.style.visibility = "hidden"; } }
//--> </script>
<!-- FIN JAVASCRIPT PARA EL MENU MERCEDES--> <!-- INICIO JAVASCRIPT PARA EL MENU AUDI-->
<script language="javascript" type="text/javascript"> <!--
function cambiaraudi () { if (submenuaudi.style.visibility == "hidden")//Especificamos la propiedad de visibilidad de la Capa1 { submenuaudi.style.visibility = "visible"; mercsub.style.visibility = "hidden"; submenubmw.style.visibility = "hidden"; submenuotros.style.visibility = "hidden"; submenuaudi.style.left = menuaudi.style.left + menuaudi.style.width;//Asignamos la posición de la capa absoluta submenuaudi.style.top = menuaudi.style.top + 117; } else { submenuaudi.style.visibility = "hidden"; } }
//--> </script>
<!-- FIN JAVASCRIPT PARA EL MENU AUDI-->
<!-- INICIO JAVASCRIPT PARA EL MENU BMW-->
<script language="javascript" type="text/javascript"> <!--
function cambiarbmw () { if (submenubmw.style.visibility == "hidden")//Especificamos la propiedad de visibilidad de la Capa1 { submenubmw.style.visibility = "visible"; mercsub.style.visibility = "hidden"; submenuaudi.style.visibility = "hidden"; submenuotros.style.visibility = "hidden"; submenubmw.style.left = menubmw.style.left + menubmw.style.width;//Asignamos la posición de la capa absoluta submenubmw.style.top = menubmw.style.top + 119; } else { submenubmw.style.visibility = "hidden"; } }
//--> </script>
<!-- FIN JAVASCRIPT PARA EL MENU BMW-->
<!-- INICIO JAVASCRIPT PARA EL MENU OTROS-->
<script language="javascript" type="text/javascript"> <!--
function cambiarotros () { if (submenuotros.style.visibility == "hidden")//Especificamos la propiedad de visibilidad de la Capa1 { submenuotros.style.visibility = "visible"; mercsub.style.visibility = "hidden"; submenuaudi.style.visibility = "hidden"; submenubmw.style.visibility = "hidden"; submenuotros.style.left = menuotros.style.left + menuotros.style.width;//Asignamos la posición de la capa absoluta submenuotros.style.top = menuotros.style.top + 117; } else { submenuotros.style.visibility = "hidden"; } }
//--> </script>
<!-- FIN JAVASCRIPT PARA EL MENU BMW--><!-- InstanceEndEditable -->
<link href="css/estilos.css" rel="stylesheet" type="text/css" />
<!-- InstanceBeginEditable name="head" -->
<style type="text/css"><!--#apDiv1 {position:absolute;width:642px;height:436px;z-index:5;left: 342px;top: 134px;}--></style>
<!-- InstanceEndEditable -->
</head>
<body>
<div id="contenedor">
<div id="cabecera"></div>
<div id="menu">
<ul class="menu">
<li><a href="#">HOME</a></li>
|
<li><a href="#">MODELOS</a></li>
|
<li><a href="#">SERVICIO POST-VENTA</a></li>
|
<li><a href="#">EMPRESA</a></li>
|
<li><a href="#">CONTACTO</a></li>
|
</ul>
</div>
<div id="contenido"><!-- InstanceBeginEditable name="EditRegion3" --> <!--MENU MERCEDES, AUDI, BMW Y OTROS-->
<div id="lateral">
<div id="merc" style="position:relative; width:126px; height:54px; margin-top:10px; background-image:url(images/menumercedesoscuro.jpg); "onClick="cambiar();"> </div>
<div id="menuaudi" style="position:relative; width:126px; height:54px; background-image:url(images/menuaudioscuro.jpg); "onClick="cambiaraudi();"> </div>
<div id="menubmw" style="position:relative; width:126px; height:54px; background-image:url(images/menubmwoscuro.jpg); "onClick="cambiarbmw();"> </div>
<div id="menuotros" style="position:relative; width:126px; height:54px; background-image:url(images/menuotrososcuro.jpg); "onClick="cambiarotros();"> </div>
</div>
<!-- FIN MENU MERCEDES, AUDIO, BMW Y OTROS-->
<!-- capas posicion absoluta MERCEDES,AUDI, BMW Y OTROS-->
<div id="mercsub" style="position:absolute; z-index:1; left: 150px; top: 139px; width:223px; height:100%; visibility: hidden;">
<ul class="modelos">
<li><a href="paginas/mercedes/clasecberlina.html" target="frame">CLASE C BERLINA</a></li>
<li><a href="paginas/mercedes/claseclcoupeoupe.html" target="frame"class="par">CLASE CL COUPE</a></li>
<li><a href="paginas/mercedes/clasersport.html" target="frame">CLASE R SPORT TOURER</a></li>
<li><a href="paginas/mercedes/claseglk.html" target="frame" class="par">CLASE GLK</a></li>
<li><a href="paginas/mercedes/claseslsamg.html" target="frame">CLASE SLS AMG</a></li>
</ul>
</div>
<div id="submenuaudi" style="position:absolute; z-index:2; left: 147px; top: 340px; width:201px; height:100%;">
<ul class="modelos">
<li><a href="paginas/audi/audia3.html" target="frame">A3</a></li>
<li><a href="paginas/audi/audia3sport.html" target="frame" class="par">A3 SPORTBACK</a></li>
<li><a href="paginas/audi/audia4avant.html" target="frame">A4 AVANT</a></li>
<li><a href="paginas/audi/audia5cabrio.html" target="frame" class="par">A5 CABRIO</a></li>
<li><a href="paginas/audi/audiq5.html" target="frame">Q5</a></li>
<li><a href="paginas/audi/audiq7.html" target="frame" class="par">Q7</a></li>
</ul>
</div>
<div id="submenubmw" style="position:absolute; z-index:3; left: 145px; top: 229px; width:223px; height:100%;">
<ul class="modelos">
<li><a href="paginas/bmw/bmws3berlina.html" target="frame">SERIE 3 BERLINA</a></li>
<li><a href="paginas/bmw/bmwserie6cabrio.html" target="frame" class="par">SERIE 6 CABRIO</a></li>
<li><a href="paginas/bmw/bmwserie7.html" target="frame">SERIE 7 HIGHT SECURITY</a></li>
<li><a href="paginas/bmw/bmwx5.html" target="frame" class="par">X5</a></li>
<li><a href="paginas/bmw/bmwx6.html" target="frame">X6</a></li>
<li><a href="paginas/bmw/bmwm3coupe.html" target="frame" class="par">M3 COUPE</a></li>
</ul>
</div>
<div id="submenuotros" style="position:absolute; z-index:4; left: 157px; top: 495px; width:223px; height:100%;">
<ul class="modelos">
<li><a href="#">---</a></li>
<li><a href="#" class="par">---</a></li>
<li><a href="#">---</a></li>
<li><a href="#" class="par">---</a></li>
<li><a href="#">---</a></li>
<li><a href="#" class="par">---</a></li>
</ul>
</div>
<!-- fin capas posicion absoluta MERCEDES,AUDI, BMW Y OTROS-->
<div id="iframe"> <iframe src="paginas/base.html" width="680px" height="460px" frameborder="0" scrolling="no" name="frame"></iframe></div>
<!-- InstanceEndEditable --></div>
<div id="pie"></div>
</div>
</body>
<!-- InstanceEnd -->
</html>
codigo de la hoja de estilos:
@charset "utf-8";
/* CSS Document */
.clear{ clear:both}
body { background-color:#000;}
ul, li, a, h1, h2{ margin:0; padding:0}
ul{ list-style:none}
#contenedor{ width:975px; border:solid 1px #484848;}
#cabecera{ background-color:#55687c; width:975px; height:85px; float:left;}
#menu{ background-color:#b6dbfc;width:100%; height:27px; float:left;}
ul.menu{
margin:4px;
padding:2.5px; /*size:0.5em;*/
font-size:0.75em;
}
ul.menu li {display:inline;/* float:left;*/ margin-right:2em; margin-left:2em; }
ul.menu.li a:link{ padding:.3em; display:block; text-decoration:none;}
ul.menu.li a:hover{padding:.3em; display:block; text-decoration:none;}
ul.menu.li a:visted{padding:.3em; display:block; text-decoration:none;}
#contenido{ background-color:#000; width:100%; height:470px; float:left;}
#merc{}
#mersub{visibility: hidden; margin-top:5em}
#menuaudi{}
#submenuaudi{visibility: hidden; margin-top:5em}
#menubmw{}
#submenubmw{visibility: hidden; margin-top:9.1em}
#menuotros{}
#submenuotros{visibility: hidden; margin-top:13.3em}
#mercsub ul {list-style:none;}
ul.modelos li{ margin-left:2em}
ul.modelos li a{ display:block; height:16px; width:160px; text-decoration:none; background-image:url(../images/menucocheimpar.jpg); background-repeat:no-repeat; color:#FFFFFF; border:1px solid #484848; font-family:Arial, Helvetica, sans-serif; font-size:0.7em; font-weight:bold;}
ul.modelos li a.par{background-image:url(../images/menucochepar.jpg); color:#000000; font-weight:bold;}
/*ESTILOS PARA EL PIE*/
#pie{ background-color:#55687c; width:100%; height:27px; clear:both;}
/*ESTILOS PARA EL PIE*/
/*MENU LATERAL DE LOS COCHES*/
#lateral{ width:135px; float:left;}
#lateral div{ /*margin-bottom:0.4em;*/ margin-top:0.8em;}
/*FIN MENU LATERAL DE LOS COCHES*/
#iframe{ float:right; margin:0; padding:0}
/*ESTILOS PARA PLANTILLA MODELOS*/
#modeloinfor{width:643px; height:440px; background-color:#FFF; text-align:center}
#modeloinfor p{ font-family:Arial, Helvetica, sans-serif; font-size:12px; text-align:justify;}
#modelomenuizq{float:left; width:399px; height:260px}
#modelomenuderch{width:244px; height:260px; float:right; margin-top:10px}
#modelodescrip{ float:left; height:140px; width:100%; /*border: solid 1px #3FC;*/ text-align:left}
#modelodescrip h3{margin-bottom:0; padding-bottom:0}
#modelopie{clear:both; height:27px; text-align:center}
#modelopie img{ border:0}
/*#modelopie div{margin-bottom:0.5em}*/
/*ESTILOS PARA PLANTILLA MODELOS DESCRIPCION*/
#modeloinfor{width:643px; height:440px; background-color:#FFF; text-align:center; margin:10px}
#modelodescrip2{ float:left; height:413px; width:100%; /*border: solid 1px #3FC;*/ text-align:left}
#modelopie{clear:both; height:27px; text-align:center}
#modelopie img{ border:0}
#modelopie a{ text-decoration:none;}
#modelodescrip2 table{ font-family:Arial, Helvetica, sans-serif; font-size:12px;}
#modelodescrip2 table td { vertical-align: bottom}
#modelopie a{font-family:Arial, Helvetica, sans-serif; font-weight:bold; color: #000; margin-bottom:0.5em;text-decoration:none;}
@charset "utf-8";
/* CSS Document */
.clear{ clear:both}
body { background-color:#000;}
ul, li, a, h1, h2{ margin:0; padding:0}
ul{ list-style:none}
#contenedor{ width:975px; border:solid 1px #484848;}
#cabecera{ background-color:#55687c; width:975px; height:85px; float:left;}
#menu{ background-color:#b6dbfc;width:100%; height:27px; float:left;}
ul.menu{
margin:4px;
padding:2.5px; /*size:0.5em;*/
font-size:0.75em;
}
ul.menu li {display:inline;/* float:left;*/ margin-right:2em; margin-left:2em; }
ul.menu.li a:link{ padding:.3em; display:block; text-decoration:none;}
ul.menu.li a:hover{padding:.3em; display:block; text-decoration:none;}
ul.menu.li a:visted{padding:.3em; display:block; text-decoration:none;}
#contenido{ background-color:#000; width:100%; height:470px; float:left;}
#merc{}
#mersub{visibility: hidden; margin-top:5em}
#menuaudi{}
#submenuaudi{visibility: hidden; margin-top:5em}
#menubmw{}
#submenubmw{visibility: hidden; margin-top:9.1em}
#menuotros{}
#submenuotros{visibility: hidden; margin-top:13.3em}
#mercsub ul {list-style:none;}
ul.modelos li{ margin-left:2em}
ul.modelos li a{ display:block; height:16px; width:160px; text-decoration:none; background-image:url(../images/menucocheimpar.jpg); background-repeat:no-repeat; color:#FFFFFF; border:1px solid #484848; font-family:Arial, Helvetica, sans-serif; font-size:0.7em; font-weight:bold;}
ul.modelos li a.par{background-image:url(../images/menucochepar.jpg); color:#000000; font-weight:bold;}
/*ESTILOS PARA EL PIE*/
#pie{ background-color:#55687c; width:100%; height:27px; clear:both;}
/*ESTILOS PARA EL PIE*/
/*MENU LATERAL DE LOS COCHES*/
#lateral{ width:135px; float:left;}
#lateral div{ /*margin-bottom:0.4em;*/ margin-top:0.8em;}
/*FIN MENU LATERAL DE LOS COCHES*/
#iframe{ float:right; margin:0; padding:0}
/*ESTILOS PARA PLANTILLA MODELOS*/
#modeloinfor{width:643px; height:440px; background-color:#FFF; text-align:center}
#modeloinfor p{ font-family:Arial, Helvetica, sans-serif; font-size:12px; text-align:justify;}
#modelomenuizq{float:left; width:399px; height:260px}
#modelomenuderch{width:244px; height:260px; float:right; margin-top:10px}
#modelodescrip{ float:left; height:140px; width:100%; /*border: solid 1px #3FC;*/ text-align:left}
#modelodescrip h3{margin-bottom:0; padding-bottom:0}
#modelopie{clear:both; height:27px; text-align:center}
#modelopie img{ border:0}
/*#modelopie div{margin-bottom:0.5em}*/
/*ESTILOS PARA PLANTILLA MODELOS DESCRIPCION*/
#modeloinfor{width:643px; height:440px; background-color:#FFF; text-align:center; margin:10px}
#modelodescrip2{ float:left; height:413px; width:100%; /*border: solid 1px #3FC;*/ text-align:left}
#modelopie{clear:both; height:27px; text-align:center}
#modelopie img{ border:0}
#modelopie a{ text-decoration:none;}
#modelodescrip2 table{ font-family:Arial, Helvetica, sans-serif; font-size:12px;}
#modelodescrip2 table td { vertical-align: bottom}
#modelopie a{font-family:Arial, Helvetica, sans-serif; font-weight:bold; color: #000; margin-bottom:0.5em;text-decoration:none;}
He intentado hacer las pruebas en local, pero como usas un montón de imágenes que no tengo me es muy difícil probar. ¿No me puedes pasar una url a la que pueda acceder para hacer la prueba?
Salu2;
Carlos.
Salu2;
Carlos.
hola, no puedo subirla ya que no tengo contratado ningun servicio de subida y alojamiento de internet, pero no te preocupes, gracias por atenderme.
Por lo que he podido probar, me funciona, aunque sin mostrarme las imágenes. ¿Qué es lo que no te funciona exactamente?
Carlos.
Carlos.
veamos, al cargar la pagina hay un menu que equivale a merc,menuaudi,menubmw,menuotros, al pulsar encima de cada imagen que refleja cada apartado del menu tendria que aparecer su submenu respectivamente.
En Internet explorer al pulsar sale y funciona todo bien. pero en firefox al pulsar no funciona el script no sale el submenu, no hace nada, debe ser que no reconoce bien las ordenes del script.
En Internet explorer al pulsar sale y funciona todo bien. pero en firefox al pulsar no funciona el script no sale el submenu, no hace nada, debe ser que no reconoce bien las ordenes del script.
- Compartir respuesta
- Anónimo
ahora mismo