Reconocer si el navegador soporta el atributo opacity

cuasatar · #1 (**permalink**) 20/07/2011, 11:51

Hola a todos. Estoy terminando de hacer una pagina donde utilizo la propiedad opacity para mostrar texto encima de imagenes a través de la propiedad filter:Alpha(opacity=50) y creo que en ccs3 ya permite hacerlo directamente con la función opacity. Sin embargo mi pagina se veria mal en navegadores antiguos que no soporten está propiedad.

Mi pregunta es: Existe alguna manera en php de que reconozca esta propiedad y en caso de que no la soporte salga una advertencia al usuario para actualizar su navegador? Si la solución se puede hacer con javascript o css directamente les agradeceria y en caso tal mandaria el tema a su correspodiente foro. Gracias de antemano a todos por su colaboración.

Marvin · #2 (**permalink**) 20/07/2011, 14:27

Revisa por este lado: http://www.forosdelweb.com/f18/ident...on-php-125099/

Suerte!

Carlangueitor · #3 (**permalink**) 20/07/2011, 17:21

Esto es de Javascript, con PHP se puede pero me parece que es mejor hacerlo del lado del cliente.

Saludos

emprear · #4 (**permalink**) 20/07/2011, 20:04

Todas las últimas versiones de los navegadores soportan opacity, al margen de esto, sabiendo que navegador la soporta y cual no, podrías con php,a lo sumo, detectar el navegador y su versión y en función de esto escribir la propiedad o no.

Para detectar si un navegador soporta opacity, tenés que valerte de javascript, mirá

http://blogs.sitepointstatic.com/exa...ion/index.html

Saludos

cuasatar · #5 (**permalink**) 21/07/2011, 06:55

Gracias emprear por la colaboración del enlace que mandaste adjunto. Estoy leyendo el codigo fuente para adaptar el codigo javascript a mi página y poder mandarle un mensaje de advertencia a los usuarios que aun usen navegadores viejos. Aunque si bien es cierto hoy en día ya todos los navegadores soportan el atributo opacity la idea es que aquellas personas que aun usan navegadores antiguos tengan la advertencia.

Mi idea mas que todo es que la navegación sea amigable con el usuario y que de entrada se encuentren con una pagina que la puedan ver sin problemas. Muchas veces uno le echa la culpa a los diseñadores cuando las paginas salen mal y la culpa en ocasiones es del mismo usuario que no actualiza su navegador.

Muchas gracias a todos por sus respuestas. Cualquier novedad ya la estare comentando.

Carlangueitor · #6 (**permalink**) 21/07/2011, 12:08

Solo una nota, el que el navegador soporte o no el atributo opacity, no tiene por que afectar la experiencia del usuario, no debería haber problema si el navegador no soporta el atributo, solo debería ser menos "estético".

Y no se a que navegadores les quieres dar soporte, filter:Alpha(opacity=50) sirve para Internet Explorer 5 a 7, si alguien utiliza algo más viejo que eso realmente necesita una actualización, ya que no solo eso no funcionará, desde la resolución de pantalla hasta el modelo de caja.

Saludos

cristian_cena · #7 (**permalink**) 21/07/2011, 20:29

Salvo que se trate de un pedido concreto, personalmente creo que han muerto las versiones ie6-.
Podrias usar php o javascript y crear hojas de estilo alternativas.
Podes presentar en una hoja de estilos alternativa un png transparente en reemplazo de opacity.

Saludos.

cuasatar · #8 (**permalink**) 21/07/2011, 22:34

Con estos dos aportes nuevos he llegado a mirar nuevas cosas que inicialmente no habia analizado. La primera es lo del valor estetico. La opacidad la estoy utilizando como capa intermedia entre una imagen y la letra de contenido de la pagina. Como ven la opacidad en este caso es muy importante porque si bien se puede usar sin problemas la pagina (se puede leer el contenido que es lo importante) se pierde el efecto entre la imagen y la letra combinados lo que hace que la pagina tenga una presencia mas llamativa.

La idea al reconocer si el servidor soporta o no la opacidad es que aquellos que aun usan navegadores conflictivos (IE6, firefox 1.5 por nombrar solo dos) migren a la ultima versión.

La idea planteada de usar png transparentes si la pense inicialmente cuando aun no sabia manejar bien el opacity, pero esta solución no la contemplo porque son muchas imagenes en muchas paginas y me parece un desperdicio de recursos hacer tanto esfuerzo de programar la pagina para que se vea bien a un porcentaje de navegadores muy reducido. Es preferible que ellos se adapten a que yo lo haga (o bueno, eso creo yo).

De verdad agradezco a todos sus opiniones, han sido muy valiosas.

Como ya estoy a punto de terminar la pagina en estos dias estare tomando una decisión de que hacer en los casos "conflictivos". Muy seguramente puede ser una combinación de php y javascript pero siempre con la opción de que el usuario se adapte y no yo a ellos.

Carlangueitor · #9 (**permalink**) 21/07/2011, 23:01

No necesitas enredarte tanto, en este caso especifico de la opacidad, hay solución para casi todos los navegadores, mira este link: http://css-tricks.com/64-css-transpa...-all-broswers/ Firefox en todas sus versiones en compatible, IE desde la 5, y los demás navegadores más o menos también.

En serio, el porcentaje utiliza IE 4 te aseguro que no llega al .01%, IE5 con trabajos llega al .1%, en los otros navegadores es más común que el usuario actualice, y los porcentajes son menores.

Cargar al servidor innecesariamente o Mandarle al cliente otros tantos bytes de Javascript por esa minoría no creo que valga la pena, piénsalo bien.

Saludos