Javascript que no funciona con mozilla

A ver si me pueden ayudar.
Estoy haciendo un trabajo de diseño de una web y he utilizado una función de javascript, en el IE me funciona de maravilla pero me acabo de dar cuenta que en el mozilla ni mención.
Voy a pegar el código fuente para ver donde puede estar el problema, muchas gracias por adelantado.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<style>
<!--
#foldheader{cursor:hand ; font-weight:bold ;
list-style-image:url(fold.gif)}
#foldinglist{list-style-image:url(list.gif)}
//-->
</style>
<script language="JavaScript1.2">
<!--
/**
 *  Based on Folding Menu Tree
 *  Dynamic Drive (www.dynamicdrive.com)
* For full source code, installation instructions,
* 100's more DHTML scripts, and Terms Of
 *  Use, visit dynamicdrive.com
 *
 *  Traducido y adaptado por http://www.losrecursosgratis.com/
 */
var head="display:''"
img1=new Image()
img1.src="fold.gif"
img2=new Image()
img2.src="open.gif"
function change(){
   if(!document.all)
      return
   if (event.srcElement.id=="foldheader") {
      var srcIndex = event.srcElement.sourceIndex
      var nested = document.all[srcIndex+1]
      if (nested.style.display=="none") {
         nested.style.display=''
         event.srcElement.style.listStyleImage="url(open.gif)"
      }
      else {
         nested.style.display="none"
         event.srcElement.style.listStyleImage="url(fold.gif)"
      }
   }
}
document.onclick=change
//-->
</script>
<title>Documento sin título</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#999999">
<!-- Colocar dentro de la etiqueta <BOBY> - cambia los enlaces y titulos por los de tu web-->
<ul>
<li id="foldheader" >..:: Aragón::..</li>
<ul id="foldinglist" style="display:none">
<li><a href="huesca.htm" target="mainFrame"><b><u>Huesca</u></b></a></li>
<li><a href="zaragoza/yacimientos_Z.htm" target="principal"><b><u>Zaragoza</u></b></a></li>
<li><a href="teruel.htm" target="mainFrame"><b><u>Teruel</u></b></a></li>
</ul>
<li id="foldheader">..:: Castilla León::..</li>
<ul id="foldinglist" style="display:none">
<li><a href="leon.htm" target="mainFrame"><b><u>León</u></b></a></li>
<li><a href="palencia.htm" target="mainFrame"><b><u>Palencia</u></b></a></li>
<li><a href="zamora.htm" target="mainFrame"><b><u>Zamora</u></b></a></li>
</ul>
</ul>
</body>
</html>
1

1 Respuesta

116.450 pts. Desarrollador web, especializado en PHP, AJAX, HTML, CSS
El problema está aquí:
var nested = document.all[srcIndex+1]
Document. All es algó que ningun navegador usa, y fue pensado para IE 5.
Reemplazalo por
var nested = document.getElementById[srcIndex+1]
Y debería andar
Me sigue sin funcionar. A demás cada vez que abro la página con el IE, me sale arriba de la barra de herramientas un mensaje de error cel ACTIVEX que si no le pincho y lo doy a aceptar tampoco me funciona. Me estoy volviendo loca!
Al hacer el cambio, me acabo de dar cuenta que tampoco me funciona con el IE, ¿por qué dios porque?!
¿Qué es lo que tendría que hacer el script? En Internet Explorer siempre va a salir esa barra, mientras lo pruebes en forma local.
Es un menu, que al pinchar encima de una opción se abre un submenú. Tal y como lo tengo me funciona bien en IE pero no en mozilla no, a ver como lo puedo solucionar, muchas gracias
Intenta con este código, debería funcionar en ambos, si esta oculto muestra el menu, si esta visible lo oculta
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<style>
<!--
#foldheader{cursor:hand ; font-weight:bold ;
list-style-image:url(fold.gif)}
#foldinglist{list-style-image:url(list.gif)}
//-->
</style>
<script type="text/javascript">
function unFold(id){
var visible = document.getElementById('foldinglist' + id).style.display;
if(visible == "none"){
document.getElementById('foldinglist' + id).style.display = "block";
}else{
document.getElementById('foldinglist' + id).style.display = "none";
}
}
</script>
<title>Documento sin título</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#999999">
<!-- Colocar dentro de la etiqueta <BOBY> - cambia los enlaces y titulos por los de tu web-->
<ul>
<li id="foldheader" onclick="unFold(1);">..:: Aragón::..</li>
<ul id="foldinglist1" style="display:none">
<li><a href="huesca.htm" target="mainFrame"><b><u>Huesca</u></b></a></li>
<li><a href="zaragoza/yacimientos_Z.htm" target="principal"><b><u>Zaragoza</u></b></a></li>
<li><a href="teruel.htm" target="mainFrame"><b><u>Teruel</u></b></a></li>
</ul>
<li id="foldheader" onclick="unFold(2);">..:: Castilla León::..</li>
<ul id="foldinglist2" style="display:none">
<li><a href="leon.htm" target="mainFrame"><b><u>León</u></b></a></li>
<li><a href="palencia.htm" target="mainFrame"><b><u>Palencia</u></b></a></li>
<li><a href="zamora.htm" target="mainFrame"><b><u>Zamora</u></b></a></li>
</ul>
</ul>
</body>
</html>

Añade tu respuesta

Haz clic para o

Más respuestas relacionadas