¿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//
<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
1
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>
¿Me puedes pasar la hoja de estilos css?
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;}
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.
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.
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.
Pues a mí si me salen los submenús al pinchar en los menús "merc", "menuaudi", etc., en iexplore, firefox y en chrome. ¿No tendrás deshabilitado el javascript en tu firefox?
esta habilitado, pero no te preocupes al final hare el menu de otra forma. gracias.
Ok. Siento no haberte podido ayudar. De todas formas, valora mi respuesta para que se quede cerrada la pregunta, aunque sea con la mínima puntuación.

Añade tu respuesta

Haz clic para o

Más respuestas relacionadas