Foros del Web » Creando para Internet » CSS »

autoresize de imagenes con css

Estas en el tema de autoresize de imagenes con css en el foro de CSS en Foros del Web. Buenas a todos! Tengo el siguiente problema: Estoy probando un cms que es buenisimo (concrete5.org) y basicamente lo que quiero lograr es que si un ...
  #1 (permalink)  
Antiguo 16/09/2010, 08:24
 
Fecha de Ingreso: junio-2009
Mensajes: 85
Antigüedad: 8 años, 6 meses
Puntos: 1
autoresize de imagenes con css

Buenas a todos!

Tengo el siguiente problema:

Estoy probando un cms que es buenisimo (concrete5.org) y basicamente lo que quiero lograr es que si un cliente sube una imagen muy ancha al contenido, automaticamente se achique al tamaño maximo que yo asigne, manteniendo las proporciones.

Encontre esta porcion de codigo en un sitio que funciona muy bien... exceptuando claro, y cuando no, a Internet Explorer. La version que no funciona es la 8, lo cual me preocupa un poco ya que actualmente es la mas utilizada.

Este es el codigo:

Código CSS:
Ver original
  1. #post_view img {
  2. max-width: 620px;
  3. height: auto !important;
  4. width: expression(this.width > 620 ? 620: true);
  5. }

donde post_view obviamente es el nombre del div que contiene la o las imagenes a achicar, y 620px la medida maxima que arbitrariamente puedo manejar.

A alguien se le ocurre una manera de que funcione este codigo en IE8, o se le ocurre otra manera para llegar al mismo resultado?

Gracias de antemano, y saludos para todos!
  #2 (permalink)  
Antiguo 16/09/2010, 10:20
Avatar de DragonX
Colaborador
 
Fecha de Ingreso: mayo-2002
Ubicación: Funkyland
Mensajes: 8.339
Antigüedad: 15 años, 6 meses
Puntos: 153
Respuesta: autoresize de imagenes con css

mira esto http://eric.polerecky.com/archives/i...tandards-mode/
  #3 (permalink)  
Antiguo 16/09/2010, 10:33
 
Fecha de Ingreso: junio-2009
Mensajes: 85
Antigüedad: 8 años, 6 meses
Puntos: 1
Respuesta: autoresize de imagenes con css

Ya le pego una mirada y te cuento a ver qué onda.

PD: Buenísima tu web, me gusta la tendencia q tiene!
  #4 (permalink)  
Antiguo 16/09/2010, 13:02
 
Fecha de Ingreso: junio-2009
Mensajes: 85
Antigüedad: 8 años, 6 meses
Puntos: 1
Respuesta: autoresize de imagenes con css

Bueno, puedo dejar un par de notas con respecto a esto:

1º: la linea width:expression ya no tiene ningún sentido (tal vez sirva en IE7 o IE6, pero no lo sé)

El resto de las notas aplican a este codigo css:

Código CSS:
Ver original
  1. #post_view img {
  2. max-width: 620px;
  3. height: auto !important;
  4. }


2º: el flamante IE9 muestra perfectamente las imagenes achicadas y escaladas.

3º: IE8 solo las muestra correctamente si el modo "vista de compatibilidad" está activado

4º: Alguien sabe si hay estadisticas de uso sobre la vista de compatibilidad? es decir, si el 99% de los usuarios de ie8 usan esta modalidad, entonces el problema estaria resuelto. Pero si solo la utiliza el 20%, entonces sigo teniendo un problema.

5º: gracias al link q me envio dragonx pude ver que las expresiones js en css no tienen sentido en los navegadores actuales (todas las versiones de FF, Opera, Safari y Chrome, ademas de IE8 en adelante)


Saludos!

PD: Todavía no pude solucionar nada... alguna idea?
  #5 (permalink)  
Antiguo 16/09/2010, 14:51
 
Fecha de Ingreso: junio-2009
Mensajes: 85
Antigüedad: 8 años, 6 meses
Puntos: 1
Respuesta: autoresize de imagenes con css

Creo haber encontrado una posible solucion:

usando este codigo css:

Código CSS:
Ver original
  1. #post_view img {
  2. max-width: 620px;
  3. height: auto !important;
  4. }

donde post_view es el id del div, y el valor de max-width obviamente es el ancho maximo permitido (valga la redundancia).

Esto funciona bien, excepto en IE8. Para solucionar esto, se puede agregar esta linea justo despues de abrir el head en el archivo html:

Código HTML:
Ver original
  1. <meta http-equiv="X-UA-Compatible" content="IE=7" />
  2. </head>

Esta linea "obliga" al IE8 a activar el modo compatibilidad y voalá!

Por el momento funciona bien. Dejo el listado de navegadores que probe:

Chrome 6

Firefox 3.6

IE8

IE9

Opera 10

Safari 4



Saludos!

Etiquetas: image, resize
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 22:14.