Como usar el comentario condicional para IE anterior a 7

[bhagat]

Hola,

Tengo un web reciente que se ve perfecto en en Opera, Firefox y IE7, solo que
en versiones 6 y anteriores, la ultima capa no se muestra correctamente porque le he puesto position:fixed y ya sabemos que no lo interpretan.

el web es este

http://www.thegardenoflight.net/esp/que.htm

la hoja CSS esta (todavía necesita una limpieza)

http://www.thegardenoflight.net/CSS/Jardindeluz3-c.css

El DIV que me da el problema es este:

#RocasFondo{
background: url(../imagenes/BACK/rocks-mitad.gif) bottom left fixed no-repeat;
position:fixed;
bottom:0px;
left:0px;
z-index: 7;
width: 550px;
height: 145px;
margin: 0 ; /* original 0 0 -50px 0 */
padding: 0;
visibility: visible;
}

Como podría poner un condicional,
<!--[if IE 6]>
código
<![endif]-->
para que en versiones anteriores no se vea este DIV. y se vea otro alternativo u otra opción similar.

La teoría la conozco, en la practica he hecho varios intentos pero no me funcionan

Otra opción sería con sniffer de browser de JavaSript pero me parece mas complicada.

Agradezco las ayudas de antemano.

Gracias

[Mikmoro]

Pues yo probaría a poner en el html el div alternativo <div id="alter">... en su sitio, luego en la hoja de estilo normal pondría:

#alter {
visibility: hidden;
}

y luego

<!--[if IE < 7]>
#RocasFondo{
visibility: hidden;
}
<![endif]-->

A ver si hay suerte.

Mikel.

[bhagat]

no entiendo lo que dices

#alter {
visibility: hidden;
}

y luego

<!--[if IE < 7]>
#RocasFondo{
visibility: hidden;
}
<![endif]-->

lo que quiero es que se vea #RocasFondo si el explorador es IE7, y que se vea un div alternativo si es IE6 o inferior, pero parece por lo que escribes si fuese IE7 no se vería este DIV

Tampoco entiendo porque el div alternativo sería con visibilidad oculta, entonces no se vería ninguno.

Me puedes explicar te lo agradezco

[Mikmoro]

Me explico: este condicional
<!--[if IE < 7]>
significa "si es menor que IE7", lo que significa que IE7, FF y los demás no se ven afectados, sólo las versiones IE anteriores al 7.

Por otro lado dices:

Como podría poner un condicional,
<!--[if IE 6]>
código
<![endif]-->
para que en versiones anteriores no se vea este DIV. y se vea otro alternativo u otra opción similar.

por eso, lo primero que le digo a ese div es que no se vea en versiones anteriores a IE7

<!--[if IE < 7]>
#RocasFondo{
visibility: hidden;
}
<![endif]-->

y después hago el selector alternativo para esas versiones anteriores, pero que no se vea para IE7, FF y el resto

#alter {
visibility: hidden;
}

Y para acabar he cometido un error y se me ha olvidado poner que sí se vea para los anteriores a IE7

<!--[if IE < 7]>
#alter {
visibility: visible;
}
<![endif]-->

lo que posiblemente te ha provocado la confusión.
Resultando:

Código:

#alter {
visibility: hidden;
}
<!--[if IE < 7]>
#RocasFondo{
visibility: hidden;
}
#alter {
visibility: visible;
}
<![endif]-->

Con esto te contestaba a la duda que señalo en negrita de cómo poner otro div alternativo para los anteriores a IE7. Si lo que preguntabas era en realidad cómo simular el efecto fixed para IE6 y anteriores no entendí la cuestión.

Si es así confírmamelo.

Mikel.

[bhagat]

Si ahora si lo entiendo, (creo) ya lo aplicaré, y te diré el resultado.

lo que me liaba fue ese error de hidden donde era visible

muchas gracias, espero que mañana con la cabeza mas fresca lo entienda aun mejor.

Un abrazo cordial

[bhagat]

no me funciona ¿que está mal?

he escrito este código en la hoja de estilos:

<!--[if IE 6]>
#RocasFondo{
visibility: hidden;
}
<![endif]-->

#RocasFondo{
background: url(../imagenes/BACK/rocks-mitad.gif) bottom left fixed no-repeat;
position:fixed;
bottom:0px;
left:0px;
z-index: 7;
width: 550px;
height: 145px;
margin: 0 ; /* original 0 0 -50px 0 */
padding: 0;
visibility: visible;
}

En teoría y como primer paso antes de crear un div alternativo, se supone que con este código, se ocultaría la visibilidad de la capa solo para ie6 o anteriores.

Y lo que me ocurre es que me oculta el DIv #RocasFondo, en todos los navegadores (ie6 ie7 ff opera)

¿que está mal?

[Mikmoro]

Prueba poniendo:

<!--[if IE 6]>
<style>
#RocasFondo{
visibility: hidden;
}
</style>
<![endif]-->

Ayer no lo puse porque lo dí por sobreentendido. Disculpa.

Pero con eso se ocultaría sólo para IE6, no para los anteriores. Para los anteriores debes poner el signo "menor que" (<), por eso ayer te ponía:

<!--[if IE <7]>

que quiere decir "menor que IE7"

Ya dirás.
Mikel.

[bhagat]

Pues sigue sin funcionar

ahora tengo una duda, porque escribes:

<!--[if IE 6]>
<style>
#RocasFondo{
visibility: hidden;
}
</style>
<![endif]-->

¿Volver escribir style en una hoja de estilos o te refieres a que escriba este código en el documento HTML ?

también lo probé (incluyéndolo en el html) y sigue sin funcionar

debe haber algo que se (me/nos) escapa

[Mikmoro]

Bueno, discúlpame; no había meditado bien la respuesta anoche.
El código que debes usar es:

Código:

  <style type="text/css">
<!--
.Estilo5 {
color: #000066;
font-weight: bold;
}
.Estilo6 {color: #000066}
#alter {
display: none;
}
-->
  </style>
<!--[if lt IE 7]>
<style>
#RocasFondo{
display: none;
}
#alter {
display: block;
}
</style>
<![endif]-->

La primera parte es para indicarte dónde colocarlo, por eso muestro un poco de código que ya tienes puesto tú (<style type="text/css">
<!--
.Estilo5 {... ) etcétera.

Luego, justo donde termina el div de las rocas (<div id="RocasFondo"></div)
coloca el alternativo, es decir:

Código:

<div id="RocasFondo"></div>
<div id="alter">Este es el div alternativo para IE6 y
anteriores</div>

No me paré a pensar en que querías quitar la roca por completo y sustituirla por otro div, y puse visibilidad cuando debía poner display, para que no ocupe sitio.
Y la segunda hermosa gamba, es que estaba usando el caracter < (menor que), en lugar de su correspondiente entidad (lt). En fin, perdona por el despiste. Si hubiera probado el código antes de escribirte me habría dado cuenta de que no estaba escribiendo bien las cosas.

Espero que ahora te funcione bien.

Mikel.