Me olvidé de hacer una aclaración en mi mensaje anterior:
Pablo Ziliani wrote:
> Por otra parte, es muy probable que el div sea completamente
> innecesario. Se te ocurrió una estructura así?:
> <body class="teorico"> <!-- puede ser un div también -->
> <h1>Simulador de conducción</h1>
> ...
> </body>
>
> el css:
> h1{características comunes de todos los h1}
> body.teorico h1{características particulares del H1 de "teorico"},
> body.tiro h1{características particulares del H1 de "tiro"}
> body.quirurgico h1{características particulares del H1 de "quirurgico"}
> body.juego h1{características particulares del H1 de "juego"}
>
> Luego el script solo tendría que cambiar la clase del body (o del div
> que englobe los h1) por la que corresponda según la imagen cliqueada.
Este caso supone que todos los H1 tienen el mismo texto y que por lo
tanto se pueden eliminar las copias dejando uno solo. Tener la clase
definida bien arriba (en el body o en un div de primera jerarquía) te
sirve para determinar la apariencia de OTROS elementos también, no solo
este H1.
Si el texto no cambia entre H1s (por lo tanto sigue siendo razonable
dejar uno solo), pero no hay otros elementos que varíen en apariencia,
quizás te conviene que el script cambie la clase del H1 directamente, en
vez de hacerlo en un elemento superior.
En cambio si el texto de los elementos variara y estuvieras forzado a
dejar las distintas instancias de H1, quizás te convenga algo así:
<body class="teorico"> <!-- puede ser un div también -->
<h1 class="teorico">Simulador de conducción TEORICO</h1>
<h1 class="tiro">Simulador de conducción TIRO</h1>
<h1 class="quirurgico">Simulador de conducción QUIRURGICO</h1>
<h1 class="juego">Simulador de conducción JUEGO</h1>
...
</body>
el css:
/*características iniciales, comunes de todos los h1; por ejemplo: */
h1{
display:none;
/* a priori esto no hace falta, ver nota abajo:
position:absolute;
top: 0;
left: 0;
*/
}
/* características del H1 "activo" */
body.teorico h1.teorico,
body.tiro h1.tiro,
body.quirurgico h1.quirurgico,
body.juego h1.juego {display: block}
Cambiar con el script la clase del body en vez de atributos particulares
del estilo del H1 te evita escribir mucho código innecesario y separa de
forma clara las reglas de apariencia y de lógica, declarando cada una en
el lugar apropiado (el archivo css y el de javascript respectívamente).
Nota: seguramente la razón por la que en tu mensaje omitiste el
"position: absolute" y apelás al visibility para esconder el elemento es
porque te interesa que se mantenga reservado el espacio que ocupan. Mala
suerte, no se pueden las dos cosas. Lo que creo que te conviene en este
caso es posicionarlo en forma relativa o estática y aplicarles (como te
dije) display:none en vez de visibility:hidden a los elementos
inactivos. De esta forma, sólo el elemento activo ocupa lugar (los otros
NO EXISTEN).
Saludos nuevamente,
Pablo
_______________________________________________
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a [email protected]
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://ovillo.org/mailman/listinfo/ovillo
