Tengo 3 div distintos pero colocados en la misma posicion y con el mismo tamaño. Cada uno contiene un gráfico SVG y lo que quiero es cambiar entre ellos segun se pase el raton o se haga click. Mi codigo es el siguiente
Código:
<div id="inicial" class="grafico" onmouseover="mostrar('tiro');ocultar('inicial');">
<object type="image/svg+xml" data="svg1.svg" />
</div>
<div id="tiro" class="grafico" onclick="mostrar('gol');ocultar('tiro');">
<object type="image/svg+xml" data="svg3.svg" />
</div>
<div id="gol" class="grafico">
<object type="image/svg+xml" data="svg2.svg" />
</div>
En Mozilla funciona bien el mouseover, pero no el click. Y en Opera el mouseover solo oculta un div pero no me muestra el siguiente.
Las funciones en javascript que tengo son estas
Código:
<script type="text/javascript">
<!--
function mostrar(imagen){
obj=document.getElementById(imagen);
obj.style.visibility= "visible";
}
function ocultar(imagen){
obj=document.getElementById(imagen);
obj.style.visibility= "hidden";
}
//-->
</script>
El codigo pasa el validor de xhtml. Agradeceria vuestra ayuda porque yo no se que mas probar. Gracias