2010-07-26 14 views
5

Tengo un elemento img en mi DOM. En función de la acción del usuario, calculo una URL para una imagen y cambio el atributo src del elemento de imagen (usando jQuery). La nueva imagen tiene un tamaño diferente al de la imagen anterior. Esto funciona bien en Safari, pero IE no cambia el tamaño de la pantalla para el tamaño de la nueva imagen. Tengo un controlador .load en el cambio src (en el que realizo algunos cambios en la clase del elemento img) ... si supiera cómo acceder al tamaño real de la imagen, podría establecer las propiedades de alto y ancho de los elementos img. ¿Son esos valores accesibles de alguna manera? Si no, ¿hay alguna otra manera de mostrar la imagen en su nuevo tamaño?Cambiar la fuente de una etiqueta de imagen (img) no cambia de tamaño en IE

Respuesta

0

Me gustaría investigar otras soluciones, pero que de hecho puede tener acceso a esa información directamente

var myImage = new Image(); 
myImage.src = $("image selector goes here").attr('src'); 
myImage.onload = function() { 
    alert(myImage.width + "," + myImage.height); 
} 
+1

Gracias por la sugerencia, pero por desgracia cuando I * cambio * src y de la imagen se carga una imagen de un nuevo tamaño, el elemento img todavía divulga la anchura y altura valores iniciales, no la imagen recién cargada (en IE, es decir, como dije, Safari modificó el tamaño de la imagen). – Zhami

+0

Intente cargar la imagen por url directamente a diferencia del método 'attr ('src')'. Así que algo como 'myImage.src =" http://example.com/awesome.gif "' luego verifica el ancho. No veo cómo eso podría reportar el mismo ancho, ya que no debería ser consciente de ello. Esto es un poco molesto ya que envía dos solicitudes a su servidor para la imagen, pero no debería ser un problema si hay memoria caché. –

+0

Mi sospecha es que el motor de renderizado tiene el diseño con la primera imagen. Las cargas de imagen subsiguientes no fuerzan la retransmisión. He reescrito todo mi enfoque para evitar este problema. – Zhami

1

que tenían el mismo problema, pero esto se encargó de ello.

$("#img").removeAttr("height").removeAttr("width").attr("src", newsrc); 
+0

No veo cómo funcionaría esto. Corrígeme si me equivoco, pero por lo que puedo ver, la altura y el ancho no son atributos DOM. Sin embargo, el estilo es. Eliminar "estilo" funciona en Chrome, mira mi respuesta. – tronbabylove

3

estoy trabajando en Chrome, IE no, pero yo estaba teniendo el mismo problema y pensaba que iba a compartir para cualquier otra persona que se topa con esta pregunta. He resuelto esto quitando el atributo "estilo" de la imagen para cambiar la fuente, es decir .:

myImg.removeAttribute ('estilo') setAttribute ('origen', newsrc).;

+0

funciona como un encanto. –

Cuestiones relacionadas