Problema con IFIXPNG y tags html "width" y "height"

[mati.cjs89]

Qué tal, como andan.

Verán, estoy intentando hacer un sitio web algo interactivo. No tengo muchos conocimoentos con JAVASCRIPT pero estoy metiendome mas o menos en JQUERY. Hasta ahora lo mio va más o menos perfecto, salvo por un detalle cuando quise hacer que en INTERNET EXPLORER 6 se vean los PNG transparentes; pero que además puedan moverse con los efectos de JQUERY, y que puedan "resizearse" con los tags de html "width" y "height".

Y he aquí mi problema: el "resizeo" no me funciona, en IE6 simplemente no veo ninguna imagen cuando le aplico los tags (sin aplicarselos la veo perfecta, pero la quiero redimensionar). Estoy usando el script IFIXPNG. Hay alguna especie de "fix" para este problema? ¿alguien tiene alguna idea para poder ayudarme, o a alguno le pasó ya esto?

Aclarando un poco mejor.....

Código HTML:

<img  src="./imagefreca.png" width="150" height="150"/> 

esto no me funciona. Si les saco los tags, si.-

PD/ en Firefox y Chrome me funciona perfecto todo lo que mencioné, el único inconveniente es el IE6.

Muchas Gracias.

[maycolalvarez]

debes especificarle las unidades: 150px(pixeles) ó 150pt(puntos), de lo contrario en algunos navegadores los ignora

[edgax]

prueba.. prueba

[jseros]

Saludos mati.cjs89. Al leer este post no conocía que librería estás usando pero al leer un poco pude darme cuenta que es un plugin de jQuery.

Cualquier png fix(script que corrige el problema de los PNG transparentes en IE6) utiliza un filtro propietario de Microsoft llamado AlphaImageLoader que inserta una imagen entre el fondo y el contenido de un objeto.

Este filtro, adicionalmente, recibe varios parametros entre los que está la URL de la imagen y la forma en que se va a mostrar la imagen. Básicamente existen 3 formas:

1. Crop: Inserta la imagen y la "recorta" si es más grande que el objeto. Esta es la opción que usa el plugin que estás implementando

2. Image: redimensiona el objeto para que ajuste a las dimensiones de la imagen que aplicas con el filtro.

3. Scale: redimensiona la imagen para que ajuste al tamaño del objeto.

Aquí puedes ver más al respecto: http://msdn.microsoft.com/en-us/libr...8VS.85%29.aspx


Cómo vez existen muchas opciones pero en tu caso te recomiendo uses la opción scale. Para ello, recomiendo hacer una copia del plugin solo para aplicar los estilos a esta imagen. Puedes modificar la siguiente línea.

Código PHP:

  return "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src='"+src+"')"; 
   

y dejarla de la siguiente manera.

Código PHP:

  return "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=scale,src='"+src+"')"; 
   

Yo modifiqué el plugin pero no la he probado. Aquí está el código de modificado:

http://pastebin.com/f680bc191

Funcionaría así:

Código PHP:

  $('el selector que necesites').ifixpng('scale');

//o también
$('el selector que necesites').ifixpng('image');

//o simplemente
$('el selector que necesites').ifixpng('crop'); 
   

Dependiendo de la opción que quieras usar. Si no pasas ningún parámetro utiliza a 'crop' por defecto.

Un saludo y nos cuentas como te va...

[mati.cjs89]

Increible!!!!!

Realmente era ese el problema entonces,, Muchas gracias a todos, se nota que tienen amplios y sorprendentes conocimientos con el tema!!!


@maycolalvarez: Había probado anteriormente poniendole px, pero era como si nada.
@edgax: Probé CASI todo, exceptuando dándole otro tamaño más cercano al real... entonces tal vez podría haberme dado cuenta de la solución que me dio jseros.
@jseros: MUCHAS gracias. Era ese el problema. Modifiqué el filtro y lo dejé en SCALE, y ahora se ve tan bien como si IE6 respetara todas las normas!!!!! jajajajajaja


Gracias:)

[jseros]

Qué bueno que te haya funcionado :)