[Ovillo] Hack PNG desde CSS

2009-02-19 Por tema Chr5
Buenos días compañeros,

Intento utilizar el pngfix hack [1], para que IE6 pueda interpretar
las imágenes PNG correctamente.

Por lo visto esto funciona cuando las imágenes son incertadas desde
html , pero ¿ qué ocurre cuando las imágenes son introducidas
desde CSS, a través de la propiedad Background-image ?

¿ Conocéis alguna solución ? ¿ Paso las imágenes desde background-image a html ?

Muchas gracias como siempre por todas vuestras opiones sugerencias y
reflexiones varias,
carlos


[1] http://homepage.ntlworld.com/bobosola/index.htm
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo


Re: [Ovillo] Hack PNG desde CSS

2009-02-19 Por tema Diana Castillo
yo para eso suelo usar el condicional con el filter:

!--[if IE]
style
#fnd_login
{
background-image: none;
filter:

progid:DXImageTransform.Microsoft.AlphaImageLoader(src=imagen.png,
sizingMethod='scale');
}
/style
![endif]--


En teoria, el ultimo pngfix creo que soportaba imagenes de fondo, pero
no estoy muy segura...alguna idea?




El 19 de febrero de 2009 13:16, Chr5 chr5ma...@gmail.com escribió:

 Buenos días compañeros,

 Intento utilizar el pngfix hack [1], para que IE6 pueda interpretar
 las imágenes PNG correctamente.

 Por lo visto esto funciona cuando las imágenes son incertadas desde
 html , pero ¿ qué ocurre cuando las imágenes son introducidas
 desde CSS, a través de la propiedad Background-image ?

 ¿ Conocéis alguna solución ? ¿ Paso las imágenes desde background-image a
 html ?

 Muchas gracias como siempre por todas vuestras opiones sugerencias y
 reflexiones varias,
 carlos


 [1] http://homepage.ntlworld.com/bobosola/index.htm
 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
 Puedes modificar tus datos o desuscribirte en la siguiente dirección:
 http://lists.ovillo.org/mailman/listinfo/ovillo

___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo


Re: [Ovillo] Hack PNG desde CSS

2009-02-19 Por tema Rodrigo Álvarez Virgós
Hola, Chr5

Chr5 escribió:
 Buenos días compañeros,

 Intento utilizar el pngfix hack [1], para que IE6 pueda interpretar
 las imágenes PNG correctamente.

 Por lo visto esto funciona cuando las imágenes son incertadas desde
 html , pero ¿ qué ocurre cuando las imágenes son introducidas
 desde CSS, a través de la propiedad Background-image ?

 ¿ Conocéis alguna solución ? ¿ Paso las imágenes desde background-image a 
 html ?

   

Con iepngfix.htc de Twinhelix [1] . Como puedes ver en la demo [2] 
funciona perfectamente con imágenes en el css

[1] http://www.twinhelix.com/css/iepngfix
[2] http://www.twinhelix.com/css/iepngfix/demo/
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo


Re: [Ovillo] Hack PNG desde CSS

2009-02-19 Por tema mar


 Prueba a buscar el archivo iepngfix.htc, es facil de encontrar y luego lo 
pones d ela siguiente forma en todas las paginas,

 

!--[if IE 6]
  style type=text/cssimg, div {behavior: url(js/iepngfix.htc);}/style
  ![endif]--

 

Espero te sirva de algo.

 

 
 Date: Thu, 19 Feb 2009 12:16:33 +
 From: chr5ma...@gmail.com
 To: ovillo@lists.ovillo.org
 Subject: [Ovillo] Hack PNG desde CSS
 
 Buenos días compañeros,
 
 Intento utilizar el pngfix hack [1], para que IE6 pueda interpretar
 las imágenes PNG correctamente.
 
 Por lo visto esto funciona cuando las imágenes son incertadas desde
 html , pero ¿ qué ocurre cuando las imágenes son introducidas
 desde CSS, a través de la propiedad Background-image ?
 
 ¿ Conocéis alguna solución ? ¿ Paso las imágenes desde background-image a 
 html ?
 
 Muchas gracias como siempre por todas vuestras opiones sugerencias y
 reflexiones varias,
 carlos
 
 
 [1] http://homepage.ntlworld.com/bobosola/index.htm
 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
 Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
 http://lists.ovillo.org/mailman/listinfo/ovillo
e
_
¡Entra en el Club oficial de Messenger y te enterarás de todas las novedades! 
http://www.vivelive.com/ilovemessenger
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo


Re: [Ovillo] Hack PNG desde CSS

2009-02-19 Por tema Dani F. Serch
Yo uso el IE8.js
http://code.google.com/p/ie7-js/

Y si que pueden usarse PNGs de fondo, pero la pega es que no pueden 
ponerse en mosaico (repetirse).


Diana Castillo escribió:
 yo para eso suelo usar el condicional con el filter:

 !--[if IE]
   style
   #fnd_login
   {
   background-image: none;
   filter:
   
 progid:DXImageTransform.Microsoft.AlphaImageLoader(src=imagen.png,
   sizingMethod='scale');
   }
   /style
   ![endif]--


 En teoria, el ultimo pngfix creo que soportaba imagenes de fondo, pero
 no estoy muy segura...alguna idea?




 El 19 de febrero de 2009 13:16, Chr5 chr5ma...@gmail.com escribió:

   
 Buenos días compañeros,

 Intento utilizar el pngfix hack [1], para que IE6 pueda interpretar
 las imágenes PNG correctamente.

 Por lo visto esto funciona cuando las imágenes son incertadas desde
 html , pero ¿ qué ocurre cuando las imágenes son introducidas
 desde CSS, a través de la propiedad Background-image ?

 ¿ Conocéis alguna solución ? ¿ Paso las imágenes desde background-image a
 html ?

 Muchas gracias como siempre por todas vuestras opiones sugerencias y
 reflexiones varias,
 carlos


 [1] http://homepage.ntlworld.com/bobosola/index.htm
 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
 Puedes modificar tus datos o desuscribirte en la siguiente dirección:
 http://lists.ovillo.org/mailman/listinfo/ovillo

 
 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
 Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
 http://lists.ovillo.org/mailman/listinfo/ovillo

   

___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo


Re: [Ovillo] Hack PNG desde CSS

2009-02-19 Por tema Chr5
Estupendo chicos,

Estoy usando esta última opción,
todo va perfecto con imágenes ubicadas en la cabecera,
pero algunas introducidas a través de rollover sprite[1], no marchan,
están posicionadas a través de css de la siguiente manera:

.boton_avance a .button {
width: 44px;
height: 49px;
background: url(../img/playbuttons-trans.png) no-repeat 100% 0;
border: none;
}

.boton_avance a:hover .button {
width: 44px;
height: 49px;
background: url(../img/playbuttons-trans.png) no-repeat 100% 100%;
border: none;
}


¿ Algunas sugerencia ?

gracias de veras a todos,
carlos

[1] http://www.alistapart.com/articles/sprites/

El día 19 de febrero de 2009 12:42, Dani F. Serch
daniou...@gmail.com escribió:
 Yo uso el IE8.js
 http://code.google.com/p/ie7-js/

 Y si que pueden usarse PNGs de fondo, pero la pega es que no pueden
 ponerse en mosaico (repetirse).


 Diana Castillo escribió:
 yo para eso suelo usar el condicional con el filter:

 !--[if IE]
   style
   #fnd_login
   {
   background-image: none;
   filter:
   
 progid:DXImageTransform.Microsoft.AlphaImageLoader(src=imagen.png,
   sizingMethod='scale');
   }
   /style
   ![endif]--


 En teoria, el ultimo pngfix creo que soportaba imagenes de fondo, pero
 no estoy muy segura...alguna idea?




 El 19 de febrero de 2009 13:16, Chr5 chr5ma...@gmail.com escribió:


 Buenos días compañeros,

 Intento utilizar el pngfix hack [1], para que IE6 pueda interpretar
 las imágenes PNG correctamente.

 Por lo visto esto funciona cuando las imágenes son incertadas desde
 html , pero ¿ qué ocurre cuando las imágenes son introducidas
 desde CSS, a través de la propiedad Background-image ?

 ¿ Conocéis alguna solución ? ¿ Paso las imágenes desde background-image a
 html ?

 Muchas gracias como siempre por todas vuestras opiones sugerencias y
 reflexiones varias,
 carlos


 [1] http://homepage.ntlworld.com/bobosola/index.htm
 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
 Puedes modificar tus datos o desuscribirte en la siguiente dirección:
 http://lists.ovillo.org/mailman/listinfo/ovillo


 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
 Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
 http://lists.ovillo.org/mailman/listinfo/ovillo



 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
 Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
 http://lists.ovillo.org/mailman/listinfo/ovillo

___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo


Re: [Ovillo] Hack PNG desde CSS

2009-02-19 Por tema Diana Castillo
como idea, yo para los rollover lo que hago es poner una imagen que contenga
los dos estados de fondo, y con css, simplemente la muevo arriba o abajo.

El 19 de febrero de 2009 14:24, Chr5 chr5ma...@gmail.com escribió:

 Estupendo chicos,

 Estoy usando esta última opción,
 todo va perfecto con imágenes ubicadas en la cabecera,
 pero algunas introducidas a través de rollover sprite[1], no marchan,
 están posicionadas a través de css de la siguiente manera:

 .boton_avance a .button {
width: 44px;
height: 49px;
background: url(../img/playbuttons-trans.png) no-repeat 100% 0;
border: none;
 }

 .boton_avance a:hover .button {
width: 44px;
height: 49px;
background: url(../img/playbuttons-trans.png) no-repeat 100% 100%;
border: none;
 }


 ¿ Algunas sugerencia ?

 gracias de veras a todos,
 carlos

 [1] http://www.alistapart.com/articles/sprites/

 El día 19 de febrero de 2009 12:42, Dani F. Serch
 daniou...@gmail.com escribió:
  Yo uso el IE8.js
  http://code.google.com/p/ie7-js/
 
  Y si que pueden usarse PNGs de fondo, pero la pega es que no pueden
  ponerse en mosaico (repetirse).
 
 
  Diana Castillo escribió:
  yo para eso suelo usar el condicional con el filter:
 
  !--[if IE]
style
#fnd_login
{
background-image: none;
filter:
 
 progid:DXImageTransform.Microsoft.AlphaImageLoader(src=imagen.png,
sizingMethod='scale');
}
/style
![endif]--
 
 
  En teoria, el ultimo pngfix creo que soportaba imagenes de fondo, pero
  no estoy muy segura...alguna idea?
 
 
 
 
  El 19 de febrero de 2009 13:16, Chr5 chr5ma...@gmail.com escribió:
 
 
  Buenos días compañeros,
 
  Intento utilizar el pngfix hack [1], para que IE6 pueda interpretar
  las imágenes PNG correctamente.
 
  Por lo visto esto funciona cuando las imágenes son incertadas desde
  html , pero ¿ qué ocurre cuando las imágenes son introducidas
  desde CSS, a través de la propiedad Background-image ?
 
  ¿ Conocéis alguna solución ? ¿ Paso las imágenes desde background-image
 a
  html ?
 
  Muchas gracias como siempre por todas vuestras opiones sugerencias y
  reflexiones varias,
  carlos
 
 
  [1] http://homepage.ntlworld.com/bobosola/index.htm
  ___
  Lista de distribución Ovillo
  Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
  Puedes modificar tus datos o desuscribirte en la siguiente dirección:
  http://lists.ovillo.org/mailman/listinfo/ovillo
 
 
  ___
  Lista de distribución Ovillo
  Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
  Puedes modificar tus datos o desuscribirte en la siguiente dirección:
 http://lists.ovillo.org/mailman/listinfo/ovillo
 
 
 
  ___
  Lista de distribución Ovillo
  Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
  Puedes modificar tus datos o desuscribirte en la siguiente dirección:
 http://lists.ovillo.org/mailman/listinfo/ovillo
 
 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
 Puedes modificar tus datos o desuscribirte en la siguiente dirección:
 http://lists.ovillo.org/mailman/listinfo/ovillo

___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo


Re: [Ovillo] Hack PNG desde CSS

2009-02-19 Por tema Jose Leiva
Te dejo un link con varias opciones de hacks para solucionar el
problema de los png en IE6
http://net.tutsplus.com/videos/screencasts/5-easy-ways-to-tackle-ie6s-transparency-issues/

El que mas funciona es
http://www.dillerdesign.com/experiment/DD_belatedPNG/ ,  pero podes
revisarlos todos a ver cual te sirve mas

El 19/02/09, Diana Castillo diana.her...@gmail.com escribió:
 como idea, yo para los rollover lo que hago es poner una imagen que contenga
 los dos estados de fondo, y con css, simplemente la muevo arriba o abajo.

 El 19 de febrero de 2009 14:24, Chr5 chr5ma...@gmail.com escribió:

 Estupendo chicos,

 Estoy usando esta última opción,
 todo va perfecto con imágenes ubicadas en la cabecera,
 pero algunas introducidas a través de rollover sprite[1], no marchan,
 están posicionadas a través de css de la siguiente manera:

 .boton_avance a .button {
width: 44px;
height: 49px;
background: url(../img/playbuttons-trans.png) no-repeat 100% 0;
border: none;
 }

 .boton_avance a:hover .button {
width: 44px;
height: 49px;
background: url(../img/playbuttons-trans.png) no-repeat 100% 100%;
border: none;
 }


 ¿ Algunas sugerencia ?

 gracias de veras a todos,
 carlos

 [1] http://www.alistapart.com/articles/sprites/

 El día 19 de febrero de 2009 12:42, Dani F. Serch
 daniou...@gmail.com escribió:
  Yo uso el IE8.js
  http://code.google.com/p/ie7-js/
 
  Y si que pueden usarse PNGs de fondo, pero la pega es que no pueden
  ponerse en mosaico (repetirse).
 
 
  Diana Castillo escribió:
  yo para eso suelo usar el condicional con el filter:
 
  !--[if IE]
style
#fnd_login
{
background-image: none;
filter:
 
 progid:DXImageTransform.Microsoft.AlphaImageLoader(src=imagen.png,
sizingMethod='scale');
}
/style
![endif]--
 
 
  En teoria, el ultimo pngfix creo que soportaba imagenes de fondo, pero
  no estoy muy segura...alguna idea?
 
 
 
 
  El 19 de febrero de 2009 13:16, Chr5 chr5ma...@gmail.com escribió:
 
 
  Buenos días compañeros,
 
  Intento utilizar el pngfix hack [1], para que IE6 pueda interpretar
  las imágenes PNG correctamente.
 
  Por lo visto esto funciona cuando las imágenes son incertadas desde
  html , pero ¿ qué ocurre cuando las imágenes son introducidas
  desde CSS, a través de la propiedad Background-image ?
 
  ¿ Conocéis alguna solución ? ¿ Paso las imágenes desde
  background-image
 a
  html ?
 
  Muchas gracias como siempre por todas vuestras opiones sugerencias y
  reflexiones varias,
  carlos
 
 
  [1] http://homepage.ntlworld.com/bobosola/index.htm
  ___
  Lista de distribución Ovillo
  Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
  Puedes modificar tus datos o desuscribirte en la siguiente dirección:
  http://lists.ovillo.org/mailman/listinfo/ovillo
 
 
  ___
  Lista de distribución Ovillo
  Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
  Puedes modificar tus datos o desuscribirte en la siguiente dirección:
 http://lists.ovillo.org/mailman/listinfo/ovillo
 
 
 
  ___
  Lista de distribución Ovillo
  Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
  Puedes modificar tus datos o desuscribirte en la siguiente dirección:
 http://lists.ovillo.org/mailman/listinfo/ovillo
 
 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
 Puedes modificar tus datos o desuscribirte en la siguiente dirección:
 http://lists.ovillo.org/mailman/listinfo/ovillo

 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
 Puedes modificar tus datos o desuscribirte en la siguiente dirección:
 http://lists.ovillo.org/mailman/listinfo/ovillo



-- 
http://daflai.wordpress.com
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo


Re: [Ovillo] Hack PNG desde CSS

2009-02-19 Por tema Alvarez Laurnaga, Jose Antonio
Creo que tu problema es que tienes que poner:

.boton_avance a.button:hover {
width: etc.

Aunque sería major ver más código HTML y css

Salu2

 -Mensaje original-
 De: ovillo-boun...@lists.ovillo.org [mailto:ovillo-boun...@lists.ovillo.org] 
 En
 nombre de Chr5
 Enviado el: jueves, 19 de febrero de 2009 14:24
 Para: Ovillo, la lista de CSS en castellano
 Asunto: Re: [Ovillo] Hack PNG desde CSS
 
 Estupendo chicos,
 
 Estoy usando esta última opción,
 todo va perfecto con imágenes ubicadas en la cabecera,
 pero algunas introducidas a través de rollover sprite[1], no marchan,
 están posicionadas a través de css de la siguiente manera:
 
 .boton_avance a .button {
  width: 44px;
  height: 49px;
  background: url(../img/playbuttons-trans.png) no-repeat 100% 0;
  border: none;
 }
 
 .boton_avance a:hover .button {
  width: 44px;
  height: 49px;
  background: url(../img/playbuttons-trans.png) no-repeat 100% 100%;
  border: none;
 }
 
 
 ¿ Algunas sugerencia ?
 
 gracias de veras a todos,
 carlos
 
 [1] http://www.alistapart.com/articles/sprites/
 
 El día 19 de febrero de 2009 12:42, Dani F. Serch
 daniou...@gmail.com escribió:
  Yo uso el IE8.js
  http://code.google.com/p/ie7-js/
 
  Y si que pueden usarse PNGs de fondo, pero la pega es que no pueden
  ponerse en mosaico (repetirse).
 
 
  Diana Castillo escribió:
  yo para eso suelo usar el condicional con el filter:
 
  !--[if IE]
style
#fnd_login
{
background-image: none;
filter:
 
 progid:DXImageTransform.Microsoft.AlphaImageLoader(src=imagen.png,
sizingMethod='scale');
}
/style
![endif]--
 
 
  En teoria, el ultimo pngfix creo que soportaba imagenes de fondo, pero
  no estoy muy segura...alguna idea?
 
 
 
 
  El 19 de febrero de 2009 13:16, Chr5 chr5ma...@gmail.com escribió:
 
 
  Buenos días compañeros,
 
  Intento utilizar el pngfix hack [1], para que IE6 pueda interpretar
  las imágenes PNG correctamente.
 
  Por lo visto esto funciona cuando las imágenes son incertadas desde
  html , pero ¿ qué ocurre cuando las imágenes son introducidas
  desde CSS, a través de la propiedad Background-image ?
 
  ¿ Conocéis alguna solución ? ¿ Paso las imágenes desde background-image a
  html ?
 
  Muchas gracias como siempre por todas vuestras opiones sugerencias y
  reflexiones varias,
  carlos
 
 
  [1] http://homepage.ntlworld.com/bobosola/index.htm
  ___
  Lista de distribución Ovillo
  Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
  Puedes modificar tus datos o desuscribirte en la siguiente dirección:
  http://lists.ovillo.org/mailman/listinfo/ovillo
 
 
  ___
  Lista de distribución Ovillo
  Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
  Puedes modificar tus datos o desuscribirte en la siguiente dirección:
 http://lists.ovillo.org/mailman/listinfo/ovillo
 
 
 
  ___
  Lista de distribución Ovillo
  Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
  Puedes modificar tus datos o desuscribirte en la siguiente dirección:
 http://lists.ovillo.org/mailman/listinfo/ovillo
 
 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
 Puedes modificar tus datos o desuscribirte en la siguiente dirección:
 http://lists.ovillo.org/mailman/listinfo/ovillo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo


Re: [Ovillo] Hack PNG desde CSS

2009-02-19 Por tema Mauricio Dulce
Hola, es necesario usar pngs, no se a veces la mejor solución no es  
esa, eso de usar filtros de png opaca un poco el color de la imagen  
prueba con jpg, gif o algo
El 19/02/2009, a las 7:34, mar escribió:



 Prueba a buscar el archivo iepngfix.htc, es facil de encontrar y  
 luego lo pones d ela siguiente forma en todas las paginas,



 !--[if IE 6]
  style type=text/cssimg, div {behavior: url(js/iepngfix.htc);}/ 
 style
  ![endif]--



 Espero te sirva de algo.




 Date: Thu, 19 Feb 2009 12:16:33 +
 From: chr5ma...@gmail.com
 To: ovillo@lists.ovillo.org
 Subject: [Ovillo] Hack PNG desde CSS

 Buenos días compañeros,

 Intento utilizar el pngfix hack [1], para que IE6 pueda interpretar
 las imágenes PNG correctamente.

 Por lo visto esto funciona cuando las imágenes son incertadas desde
 html , pero ¿ qué ocurre cuando las imágenes son introducidas
 desde CSS, a través de la propiedad Background-image ?

 ¿ Conocéis alguna solución ? ¿ Paso las imágenes desde background- 
 image a html ?

 Muchas gracias como siempre por todas vuestras opiones sugerencias y
 reflexiones varias,
 carlos


 [1] http://homepage.ntlworld.com/bobosola/index.htm
 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
 Puedes modificar tus datos o desuscribirte en la siguiente  
 dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
 e
 _
 ¡Entra en el Club oficial de Messenger y te enterarás de todas las  
 novedades!
 http://www.vivelive.com/ilovemessenger
 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
 Puedes modificar tus datos o desuscribirte en la siguiente  
 dirección: http://lists.ovillo.org/mailman/listinfo/ovillo

Mauricio Dulce
mauricio.du...@gmail.com
+57 315 4183043
http://www.3zona.com

___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo


Re: [Ovillo] Hack PNG desde CSS

2009-02-19 Por tema Chr5
La clase .button corresponde a imágenes contenidas dentro del enlace:

.boton_avance a:hover .button {
   width: 44px;
   height: 49px;
   background: url(../img/playbuttons-trans.png) no-repeat 100% 100%;
   border: none;
}

!--- html -

div class=boton_avance
  a href=# title=avanzarimg class=button
src=img/1x1.gif alt=Avance //a
/div

La parte que no interpreta es el posicionamiento a través de la
pseudoclase :hover cuando hago rollover...

 background: url(../img/playbuttons-trans.png) no-repeat 100% 100%;


El día 19 de febrero de 2009 14:52, Alvarez Laurnaga, Jose Antonio
jalva...@softwareag.es escribió:
 Creo que tu problema es que tienes que poner:

 .boton_avance a.button:hover {
width: etc.

 Aunque sería major ver más código HTML y css

 Salu2

 -Mensaje original-
 De: ovillo-boun...@lists.ovillo.org 
 [mailto:ovillo-boun...@lists.ovillo.org] En
 nombre de Chr5
 Enviado el: jueves, 19 de febrero de 2009 14:24
 Para: Ovillo, la lista de CSS en castellano
 Asunto: Re: [Ovillo] Hack PNG desde CSS
 
 Estupendo chicos,
 
 Estoy usando esta última opción,
 todo va perfecto con imágenes ubicadas en la cabecera,
 pero algunas introducidas a través de rollover sprite[1], no marchan,
 están posicionadas a través de css de la siguiente manera:
 
 .boton_avance a .button {
  width: 44px;
  height: 49px;
  background: url(../img/playbuttons-trans.png) no-repeat 100% 0;
  border: none;
 }
 
 .boton_avance a:hover .button {
  width: 44px;
  height: 49px;
  background: url(../img/playbuttons-trans.png) no-repeat 100% 100%;
  border: none;
 }
 
 
 ¿ Algunas sugerencia ?
 
 gracias de veras a todos,
 carlos
 
 [1] http://www.alistapart.com/articles/sprites/
 
 El día 19 de febrero de 2009 12:42, Dani F. Serch
 daniou...@gmail.com escribió:
  Yo uso el IE8.js
  http://code.google.com/p/ie7-js/
 
  Y si que pueden usarse PNGs de fondo, pero la pega es que no pueden
  ponerse en mosaico (repetirse).
 
 
  Diana Castillo escribió:
  yo para eso suelo usar el condicional con el filter:
 
  !--[if IE]
style
#fnd_login
{
background-image: none;
filter:
 
 progid:DXImageTransform.Microsoft.AlphaImageLoader(src=imagen.png,
sizingMethod='scale');
}
/style
![endif]--
 
 
  En teoria, el ultimo pngfix creo que soportaba imagenes de fondo, pero
  no estoy muy segura...alguna idea?
 
 
 
 
  El 19 de febrero de 2009 13:16, Chr5 chr5ma...@gmail.com escribió:
 
 
  Buenos días compañeros,
 
  Intento utilizar el pngfix hack [1], para que IE6 pueda interpretar
  las imágenes PNG correctamente.
 
  Por lo visto esto funciona cuando las imágenes son incertadas desde
  html , pero ¿ qué ocurre cuando las imágenes son introducidas
  desde CSS, a través de la propiedad Background-image ?
 
  ¿ Conocéis alguna solución ? ¿ Paso las imágenes desde background-image 
  a
  html ?
 
  Muchas gracias como siempre por todas vuestras opiones sugerencias y
  reflexiones varias,
  carlos
 
 
  [1] http://homepage.ntlworld.com/bobosola/index.htm
  ___
  Lista de distribución Ovillo
  Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
  Puedes modificar tus datos o desuscribirte en la siguiente dirección:
  http://lists.ovillo.org/mailman/listinfo/ovillo
 
 
  ___
  Lista de distribución Ovillo
  Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
  Puedes modificar tus datos o desuscribirte en la siguiente dirección:
 http://lists.ovillo.org/mailman/listinfo/ovillo
 
 
 
  ___
  Lista de distribución Ovillo
  Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
  Puedes modificar tus datos o desuscribirte en la siguiente dirección:
 http://lists.ovillo.org/mailman/listinfo/ovillo
 
 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
 Puedes modificar tus datos o desuscribirte en la siguiente dirección:
 http://lists.ovillo.org/mailman/listinfo/ovillo
 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
 Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
 http://lists.ovillo.org/mailman/listinfo/ovillo

___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo


Re: [Ovillo] Hack PNG desde CSS

2009-02-19 Por tema Rodrigo Álvarez Virgós
PNG tiene la versión 32 bits y la versión de 8 bits (para mí que el 
png-24 es un invento del Photoshop...). La diferencia es que con png de 
8 bits sólo se pueden crear imágenes de 256 colores (como los gif), 
mientras que con la de 32 tienes una gama de dos-elevado-a-treintaydos 
colores (como los jpg). Para un diseñador gráfico el png-8 se puede 
quedar corto.

Victor Hugo Arias Valencia escribió:
 Puede ser de utilidad para quien no lo sepa, el formato PNG viene en dos
 tipos, PNG-8 y PNG-24, por lo general utilizamos el PNG-24 y nos complicamos
 con el sin necesidad (como en botones e iconos), si no estoy mal el PNG-8 no
 tiene el problema de transparencia en Explorer 6.
 Dejo igual un artículo que explica muchisimo mejor que yo...

 http://www.sitepoint.com/blogs/2007/09/18/png8-the-clear-winner/

 El 19 de febrero de 2009 10:05, Chr5 chr5ma...@gmail.com escribió:

   
 La clase .button corresponde a imágenes contenidas dentro del enlace:

 .boton_avance a:hover .button {
   width: 44px;
   height: 49px;
   background: url(../img/playbuttons-trans.png) no-repeat 100% 100%;
   border: none;
 }

 !--- html -

 div class=boton_avance
  a href=# title=avanzarimg class=button
 src=img/1x1.gif alt=Avance //a
 /div

 La parte que no interpreta es el posicionamiento a través de la
 pseudoclase :hover cuando hago rollover...

  background: url(../img/playbuttons-trans.png) no-repeat 100% 100%;


 El día 19 de febrero de 2009 14:52, Alvarez Laurnaga, Jose Antonio
 jalva...@softwareag.es escribió:
 
 Creo que tu problema es que tienes que poner:

 .boton_avance a.button:hover {
width: etc.

 Aunque sería major ver más código HTML y css

 Salu2

   
 -Mensaje original-
 De: ovillo-boun...@lists.ovillo.org [mailto:
   
 ovillo-boun...@lists.ovillo.org] En
 
 nombre de Chr5
 Enviado el: jueves, 19 de febrero de 2009 14:24
 Para: Ovillo, la lista de CSS en castellano
 Asunto: Re: [Ovillo] Hack PNG desde CSS

 Estupendo chicos,

 Estoy usando esta última opción,
 todo va perfecto con imágenes ubicadas en la cabecera,
 pero algunas introducidas a través de rollover sprite[1], no marchan,
 están posicionadas a través de css de la siguiente manera:

 .boton_avance a .button {
 width: 44px;
 height: 49px;
 background: url(../img/playbuttons-trans.png) no-repeat 100% 0;
 border: none;
 }

 .boton_avance a:hover .button {
 width: 44px;
 height: 49px;
 background: url(../img/playbuttons-trans.png) no-repeat 100% 100%;
 border: none;
 }


 ¿ Algunas sugerencia ?

 gracias de veras a todos,
 carlos

 [1] http://www.alistapart.com/articles/sprites/

 El día 19 de febrero de 2009 12:42, Dani F. Serch
 daniou...@gmail.com escribió:
   
 Yo uso el IE8.js
 http://code.google.com/p/ie7-js/

 Y si que pueden usarse PNGs de fondo, pero la pega es que no pueden
 ponerse en mosaico (repetirse).


 Diana Castillo escribió:
 
 yo para eso suelo usar el condicional con el filter:

 !--[if IE]
   style
   #fnd_login
   {
   background-image: none;
   filter:

   
 progid:DXImageTransform.Microsoft.AlphaImageLoader(src=imagen.png,
   
   sizingMethod='scale');
   }
   /style
   ![endif]--


 En teoria, el ultimo pngfix creo que soportaba imagenes de fondo,
   
 pero
 
 no estoy muy segura...alguna idea?




 El 19 de febrero de 2009 13:16, Chr5 chr5ma...@gmail.com
   
 escribió:
 
   
 Buenos días compañeros,

 Intento utilizar el pngfix hack [1], para que IE6 pueda interpretar
 las imágenes PNG correctamente.

 Por lo visto esto funciona cuando las imágenes son incertadas desde
 html , pero ¿ qué ocurre cuando las imágenes son introducidas
 desde CSS, a través de la propiedad Background-image ?

 ¿ Conocéis alguna solución ? ¿ Paso las imágenes desde
 
 background-image a
 
 html ?

 Muchas gracias como siempre por todas vuestras opiones sugerencias
 
 y
 
 reflexiones varias,
 carlos


 [1] http://homepage.ntlworld.com/bobosola/index.htm
 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a
 
 Ovillo@lists.ovillo.org
 
 Puedes modificar tus datos o desuscribirte en la siguiente
 
 dirección:
 
 http://lists.ovillo.org/mailman/listinfo/ovillo


 
 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
 Puedes modificar tus datos o desuscribirte en la siguiente
   
 dirección:
 
 http://lists.ovillo.org/mailman/listinfo/ovillo

Re: [Ovillo] Hack PNG desde CSS

2009-02-19 Por tema Victor Hugo Arias Valencia
Huy si que pena, tan acostumbrado a ver el 24 en Photoshop que ya se me
pegó...
Si el PNG-8 es como un Gif, pero en botones, iconos, o cosas por el estilo
puede ser más eficiente...

Igual no se si estoy en lo cierto, si alguien ya lo ha trabajado nos cuenta
por favor...

El 19 de febrero de 2009 10:20, Rodrigo Álvarez Virgós 
rodri.vir...@gmail.com escribió:

 PNG tiene la versión 32 bits y la versión de 8 bits (para mí que el
 png-24 es un invento del Photoshop...). La diferencia es que con png de
 8 bits sólo se pueden crear imágenes de 256 colores (como los gif),
 mientras que con la de 32 tienes una gama de dos-elevado-a-treintaydos
 colores (como los jpg). Para un diseñador gráfico el png-8 se puede
 quedar corto.

 Victor Hugo Arias Valencia escribió:
  Puede ser de utilidad para quien no lo sepa, el formato PNG viene en dos
  tipos, PNG-8 y PNG-24, por lo general utilizamos el PNG-24 y nos
 complicamos
  con el sin necesidad (como en botones e iconos), si no estoy mal el PNG-8
 no
  tiene el problema de transparencia en Explorer 6.
  Dejo igual un artículo que explica muchisimo mejor que yo...
 
  http://www.sitepoint.com/blogs/2007/09/18/png8-the-clear-winner/
 
  El 19 de febrero de 2009 10:05, Chr5 chr5ma...@gmail.com escribió:
 
 
  La clase .button corresponde a imágenes contenidas dentro del enlace:
 
  .boton_avance a:hover .button {
width: 44px;
height: 49px;
background: url(../img/playbuttons-trans.png) no-repeat 100% 100%;
border: none;
  }
 
  !--- html -
 
  div class=boton_avance
   a href=# title=avanzarimg class=button
  src=img/1x1.gif alt=Avance //a
  /div
 
  La parte que no interpreta es el posicionamiento a través de la
  pseudoclase :hover cuando hago rollover...
 
   background: url(../img/playbuttons-trans.png) no-repeat 100% 100%;
 
 
  El día 19 de febrero de 2009 14:52, Alvarez Laurnaga, Jose Antonio
  jalva...@softwareag.es escribió:
 
  Creo que tu problema es que tienes que poner:
 
  .boton_avance a.button:hover {
 width: etc.
 
  Aunque sería major ver más código HTML y css
 
  Salu2
 
 
  -Mensaje original-
  De: ovillo-boun...@lists.ovillo.org [mailto:
 
  ovillo-boun...@lists.ovillo.org] En
 
  nombre de Chr5
  Enviado el: jueves, 19 de febrero de 2009 14:24
  Para: Ovillo, la lista de CSS en castellano
  Asunto: Re: [Ovillo] Hack PNG desde CSS
 
  Estupendo chicos,
 
  Estoy usando esta última opción,
  todo va perfecto con imágenes ubicadas en la cabecera,
  pero algunas introducidas a través de rollover sprite[1], no marchan,
  están posicionadas a través de css de la siguiente manera:
 
  .boton_avance a .button {
  width: 44px;
  height: 49px;
  background: url(../img/playbuttons-trans.png) no-repeat 100% 0;
  border: none;
  }
 
  .boton_avance a:hover .button {
  width: 44px;
  height: 49px;
  background: url(../img/playbuttons-trans.png) no-repeat 100%
 100%;
  border: none;
  }
 
 
  ¿ Algunas sugerencia ?
 
  gracias de veras a todos,
  carlos
 
  [1] http://www.alistapart.com/articles/sprites/
 
  El día 19 de febrero de 2009 12:42, Dani F. Serch
  daniou...@gmail.com escribió:
 
  Yo uso el IE8.js
  http://code.google.com/p/ie7-js/
 
  Y si que pueden usarse PNGs de fondo, pero la pega es que no pueden
  ponerse en mosaico (repetirse).
 
 
  Diana Castillo escribió:
 
  yo para eso suelo usar el condicional con el filter:
 
  !--[if IE]
style
#fnd_login
{
background-image: none;
filter:
 
 
  progid:DXImageTransform.Microsoft.AlphaImageLoader(src=imagen.png,
 
sizingMethod='scale');
}
/style
![endif]--
 
 
  En teoria, el ultimo pngfix creo que soportaba imagenes de fondo,
 
  pero
 
  no estoy muy segura...alguna idea?
 
 
 
 
  El 19 de febrero de 2009 13:16, Chr5 chr5ma...@gmail.com
 
  escribió:
 
 
  Buenos días compañeros,
 
  Intento utilizar el pngfix hack [1], para que IE6 pueda
 interpretar
  las imágenes PNG correctamente.
 
  Por lo visto esto funciona cuando las imágenes son incertadas
 desde
  html , pero ¿ qué ocurre cuando las imágenes son introducidas
  desde CSS, a través de la propiedad Background-image ?
 
  ¿ Conocéis alguna solución ? ¿ Paso las imágenes desde
 
  background-image a
 
  html ?
 
  Muchas gracias como siempre por todas vuestras opiones sugerencias
 
  y
 
  reflexiones varias,
  carlos
 
 
  [1] http://homepage.ntlworld.com/bobosola/index.htm
  ___
  Lista de distribución Ovillo
  Para escribir a la lista, envia un correo a
 
  Ovillo@lists.ovillo.org
 
  Puedes modificar tus datos o desuscribirte en la siguiente
 
  dirección:
 
  http://lists.ovillo.org/mailman/listinfo/ovillo

Re: [Ovillo] Hack PNG desde CSS

2009-02-19 Por tema Martin Etxauri
aupa

me parece muy interesante la solución que comentan en el link.

¿alguien sabe si hay algún otro programa que ofrezca ese pequeño truco  
aparde de Fireworks?

no puedo dar crédito a que solo se pueda hacer con Fireworks, y he  
pensado que tal vez gimp o alguno de estos lo tendría, pero en el Gimp  
no encuentro nada parecido

¿alguna idea?

gracias


El 19/02/2009, a las 16:12, Victor Hugo Arias Valencia escribió:

 Puede ser de utilidad para quien no lo sepa, el formato PNG viene en  
 dos
 tipos, PNG-8 y PNG-24, por lo general utilizamos el PNG-24 y nos  
 complicamos
 con el sin necesidad (como en botones e iconos), si no estoy mal el  
 PNG-8 no
 tiene el problema de transparencia en Explorer 6.
 Dejo igual un artículo que explica muchisimo mejor que yo...

 http://www.sitepoint.com/blogs/2007/09/18/png8-the-clear-winner/

 El 19 de febrero de 2009 10:05, Chr5 chr5ma...@gmail.com escribió:

 La clase .button corresponde a imágenes contenidas dentro del enlace:

 .boton_avance a:hover .button {
  width: 44px;
  height: 49px;
  background: url(../img/playbuttons-trans.png) no-repeat 100%  
 100%;
  border: none;
 }

 !--- html -

 div class=boton_avance
 a href=# title=avanzarimg class=button
 src=img/1x1.gif alt=Avance //a
 /div

 La parte que no interpreta es el posicionamiento a través de la
 pseudoclase :hover cuando hago rollover...

 background: url(../img/playbuttons-trans.png) no-repeat 100% 100%;


 El día 19 de febrero de 2009 14:52, Alvarez Laurnaga, Jose Antonio
 jalva...@softwareag.es escribió:
 Creo que tu problema es que tienes que poner:

 .boton_avance a.button:hover {
   width: etc.

 Aunque sería major ver más código HTML y css

 Salu2

 -Mensaje original-
 De: ovillo-boun...@lists.ovillo.org [mailto:
 ovillo-boun...@lists.ovillo.org] En
 nombre de Chr5
 Enviado el: jueves, 19 de febrero de 2009 14:24
 Para: Ovillo, la lista de CSS en castellano
 Asunto: Re: [Ovillo] Hack PNG desde CSS

 Estupendo chicos,

 Estoy usando esta última opción,
 todo va perfecto con imágenes ubicadas en la cabecera,
 pero algunas introducidas a través de rollover sprite[1], no  
 marchan,
 están posicionadas a través de css de la siguiente manera:

 .boton_avance a .button {
width: 44px;
height: 49px;
background: url(../img/playbuttons-trans.png) no-repeat 100% 0;
border: none;
 }

 .boton_avance a:hover .button {
width: 44px;
height: 49px;
background: url(../img/playbuttons-trans.png) no-repeat 100%  
 100%;
border: none;
 }


 ¿ Algunas sugerencia ?

 gracias de veras a todos,
 carlos

 [1] http://www.alistapart.com/articles/sprites/

 El día 19 de febrero de 2009 12:42, Dani F. Serch
 daniou...@gmail.com escribió:
 Yo uso el IE8.js
 http://code.google.com/p/ie7-js/

 Y si que pueden usarse PNGs de fondo, pero la pega es que no  
 pueden
 ponerse en mosaico (repetirse).


 Diana Castillo escribió:
 yo para eso suelo usar el condicional con el filter:

 !--[if IE]
  style
  #fnd_login
  {
  background-image: none;
  filter:

 progid:DXImageTransform.Microsoft.AlphaImageLoader(src=imagen.png,
  sizingMethod='scale');
  }
  /style
  ![endif]--


 En teoria, el ultimo pngfix creo que soportaba imagenes de  
 fondo,
 pero
 no estoy muy segura...alguna idea?




 El 19 de febrero de 2009 13:16, Chr5 chr5ma...@gmail.com
 escribió:


 Buenos días compañeros,

 Intento utilizar el pngfix hack [1], para que IE6 pueda  
 interpretar
 las imágenes PNG correctamente.

 Por lo visto esto funciona cuando las imágenes son incertadas  
 desde
 html , pero ¿ qué ocurre cuando las imágenes son  
 introducidas
 desde CSS, a través de la propiedad Background-image ?

 ¿ Conocéis alguna solución ? ¿ Paso las imágenes desde
 background-image a
 html ?

 Muchas gracias como siempre por todas vuestras opiones  
 sugerencias
 y
 reflexiones varias,
 carlos


 [1] http://homepage.ntlworld.com/bobosola/index.htm
 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a
 Ovillo@lists.ovillo.org
 Puedes modificar tus datos o desuscribirte en la siguiente
 dirección:
 http://lists.ovillo.org/mailman/listinfo/ovillo


 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
 Puedes modificar tus datos o desuscribirte en la siguiente
 dirección:
 http://lists.ovillo.org/mailman/listinfo/ovillo



 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
 Puedes modificar tus datos o desuscribirte en la siguiente  
 dirección:
 http://lists.ovillo.org/mailman/listinfo/ovillo

Re: [Ovillo] Hack PNG desde CSS

2009-02-19 Por tema Félix Horro Pita
 pero en el Gimp no encuentro nada parecido

En Gimp marcas el PNG como RGB (32 bits) o como indexado (8 bits) en el
menú Imagen - Modo.

Saludos!




Martin Etxauri wrote:
 aupa
 
 me parece muy interesante la solución que comentan en el link.
 
 ¿alguien sabe si hay algún otro programa que ofrezca ese pequeño truco  
 aparde de Fireworks?
 
 no puedo dar crédito a que solo se pueda hacer con Fireworks, y he  
 pensado que tal vez gimp o alguno de estos lo tendría, pero en el Gimp  
 no encuentro nada parecido
 
 ¿alguna idea?
 
 gracias
 
 
 El 19/02/2009, a las 16:12, Victor Hugo Arias Valencia escribió:
 
 Puede ser de utilidad para quien no lo sepa, el formato PNG viene en  
 dos
 tipos, PNG-8 y PNG-24, por lo general utilizamos el PNG-24 y nos  
 complicamos
 con el sin necesidad (como en botones e iconos), si no estoy mal el  
 PNG-8 no
 tiene el problema de transparencia en Explorer 6.
 Dejo igual un artículo que explica muchisimo mejor que yo...

 http://www.sitepoint.com/blogs/2007/09/18/png8-the-clear-winner/

 El 19 de febrero de 2009 10:05, Chr5 chr5ma...@gmail.com escribió:

 La clase .button corresponde a imágenes contenidas dentro del enlace:

 .boton_avance a:hover .button {
  width: 44px;
  height: 49px;
  background: url(../img/playbuttons-trans.png) no-repeat 100%  
 100%;
  border: none;
 }

 !--- html -

 div class=boton_avance
 a href=# title=avanzarimg class=button
 src=img/1x1.gif alt=Avance //a
 /div

 La parte que no interpreta es el posicionamiento a través de la
 pseudoclase :hover cuando hago rollover...

 background: url(../img/playbuttons-trans.png) no-repeat 100% 100%;


 El día 19 de febrero de 2009 14:52, Alvarez Laurnaga, Jose Antonio
 jalva...@softwareag.es escribió:
 Creo que tu problema es que tienes que poner:

 .boton_avance a.button:hover {
   width: etc.

 Aunque sería major ver más código HTML y css

 Salu2

 -Mensaje original-
 De: ovillo-boun...@lists.ovillo.org [mailto:
 ovillo-boun...@lists.ovillo.org] En
 nombre de Chr5
 Enviado el: jueves, 19 de febrero de 2009 14:24
 Para: Ovillo, la lista de CSS en castellano
 Asunto: Re: [Ovillo] Hack PNG desde CSS

 Estupendo chicos,

 Estoy usando esta última opción,
 todo va perfecto con imágenes ubicadas en la cabecera,
 pero algunas introducidas a través de rollover sprite[1], no  
 marchan,
 están posicionadas a través de css de la siguiente manera:

 .boton_avance a .button {
width: 44px;
height: 49px;
background: url(../img/playbuttons-trans.png) no-repeat 100% 0;
border: none;
 }

 .boton_avance a:hover .button {
width: 44px;
height: 49px;
background: url(../img/playbuttons-trans.png) no-repeat 100%  
 100%;
border: none;
 }


 ¿ Algunas sugerencia ?

 gracias de veras a todos,
 carlos

 [1] http://www.alistapart.com/articles/sprites/

 El día 19 de febrero de 2009 12:42, Dani F. Serch
 daniou...@gmail.com escribió:
 Yo uso el IE8.js
 http://code.google.com/p/ie7-js/

 Y si que pueden usarse PNGs de fondo, pero la pega es que no  
 pueden
 ponerse en mosaico (repetirse).


 Diana Castillo escribió:
 yo para eso suelo usar el condicional con el filter:

 !--[if IE]
  style
  #fnd_login
  {
  background-image: none;
  filter:

 progid:DXImageTransform.Microsoft.AlphaImageLoader(src=imagen.png,
  sizingMethod='scale');
  }
  /style
  ![endif]--


 En teoria, el ultimo pngfix creo que soportaba imagenes de  
 fondo,
 pero
 no estoy muy segura...alguna idea?




 El 19 de febrero de 2009 13:16, Chr5 chr5ma...@gmail.com
 escribió:

 Buenos días compañeros,

 Intento utilizar el pngfix hack [1], para que IE6 pueda  
 interpretar
 las imágenes PNG correctamente.

 Por lo visto esto funciona cuando las imágenes son incertadas  
 desde
 html , pero ¿ qué ocurre cuando las imágenes son  
 introducidas
 desde CSS, a través de la propiedad Background-image ?

 ¿ Conocéis alguna solución ? ¿ Paso las imágenes desde
 background-image a
 html ?

 Muchas gracias como siempre por todas vuestras opiones  
 sugerencias
 y
 reflexiones varias,
 carlos


 [1] http://homepage.ntlworld.com/bobosola/index.htm
 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a
 Ovillo@lists.ovillo.org
 Puedes modificar tus datos o desuscribirte en la siguiente
 dirección:
 http://lists.ovillo.org/mailman/listinfo/ovillo


 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
 Puedes modificar tus datos o desuscribirte en la siguiente
 dirección:
 http://lists.ovillo.org/mailman/listinfo/ovillo

 ___
 Lista de distribución Ovillo
 Para escribir a la

Re: [Ovillo] Hack PNG desde CSS

2009-02-19 Por tema Martin Etxauri
 En Gimp marcas el PNG como RGB (32 bits) o como indexado (8 bits) en  
 el
 menú Imagen - Modo.

Si, eso si, pero yo hablaba del truco que aparece en el link que  
mandaba Victor Hugo, donde el Fireworks, al cambiar de Indexed  
transparency a Alpha transparency permite obtener varios colores con  
alpha en un PNG de 8bits, lo cual permite tener una transparencia con  
diferentes niveles de alpha, algo que, en principio, se supone que no  
se puede hacer en un PNG de 8. Además, se comporta mejor en los  
diferentes navegadores que el PNG de 32, ya que con el truco del de 8  
bits IE 6 (e inferiores) hace desaparecer los pixeles que tienen una  
transparencia media para ponerlos completamente transparentes y (si no  
me equivoco) con el PNG de 32 bits IE pone opacos todos los pixeles  
con algo de transparencia lo cual es peor porque desaparece toda  
transparencia.

He estado buscando algo mas y no parece que esto se pueda hacer con  
otro programa que no sea Fireworks, una pena.

¿Alguien tiene un Photoshop CS4 instalado para ver si hay algo de esto  
en el save for web?

gracias



 Saludos!




 Martin Etxauri wrote:
 aupa

 me parece muy interesante la solución que comentan en el link.

 ¿alguien sabe si hay algún otro programa que ofrezca ese pequeño  
 truco
 aparde de Fireworks?

 no puedo dar crédito a que solo se pueda hacer con Fireworks, y he
 pensado que tal vez gimp o alguno de estos lo tendría, pero en el  
 Gimp
 no encuentro nada parecido

 ¿alguna idea?

 gracias


 El 19/02/2009, a las 16:12, Victor Hugo Arias Valencia escribió:

 Puede ser de utilidad para quien no lo sepa, el formato PNG viene en
 dos
 tipos, PNG-8 y PNG-24, por lo general utilizamos el PNG-24 y nos
 complicamos
 con el sin necesidad (como en botones e iconos), si no estoy mal el
 PNG-8 no
 tiene el problema de transparencia en Explorer 6.
 Dejo igual un artículo que explica muchisimo mejor que yo...

 http://www.sitepoint.com/blogs/2007/09/18/png8-the-clear-winner/

 El 19 de febrero de 2009 10:05, Chr5 chr5ma...@gmail.com escribió:

 La clase .button corresponde a imágenes contenidas dentro del  
 enlace:

 .boton_avance a:hover .button {
 width: 44px;
 height: 49px;
 background: url(../img/playbuttons-trans.png) no-repeat 100%
 100%;
 border: none;
 }

 !--- html -

 div class=boton_avance
a href=# title=avanzarimg class=button
 src=img/1x1.gif alt=Avance //a
 /div

 La parte que no interpreta es el posicionamiento a través de la
 pseudoclase :hover cuando hago rollover...

 background: url(../img/playbuttons-trans.png) no-repeat 100% 100%;


 El día 19 de febrero de 2009 14:52, Alvarez Laurnaga, Jose Antonio
 jalva...@softwareag.es escribió:
 Creo que tu problema es que tienes que poner:

 .boton_avance a.button:hover {
  width: etc.

 Aunque sería major ver más código HTML y css

 Salu2

 -Mensaje original-
 De: ovillo-boun...@lists.ovillo.org [mailto:
 ovillo-boun...@lists.ovillo.org] En
 nombre de Chr5
 Enviado el: jueves, 19 de febrero de 2009 14:24
 Para: Ovillo, la lista de CSS en castellano
 Asunto: Re: [Ovillo] Hack PNG desde CSS

 Estupendo chicos,

 Estoy usando esta última opción,
 todo va perfecto con imágenes ubicadas en la cabecera,
 pero algunas introducidas a través de rollover sprite[1], no
 marchan,
 están posicionadas a través de css de la siguiente manera:

 .boton_avance a .button {
   width: 44px;
   height: 49px;
   background: url(../img/playbuttons-trans.png) no-repeat 100%  
 0;
   border: none;
 }

 .boton_avance a:hover .button {
   width: 44px;
   height: 49px;
   background: url(../img/playbuttons-trans.png) no-repeat 100%
 100%;
   border: none;
 }


 ¿ Algunas sugerencia ?

 gracias de veras a todos,
 carlos

 [1] http://www.alistapart.com/articles/sprites/

 El día 19 de febrero de 2009 12:42, Dani F. Serch
 daniou...@gmail.com escribió:
 Yo uso el IE8.js
 http://code.google.com/p/ie7-js/

 Y si que pueden usarse PNGs de fondo, pero la pega es que no
 pueden
 ponerse en mosaico (repetirse).


 Diana Castillo escribió:
 yo para eso suelo usar el condicional con el filter:

 !--[if IE]
 style
 #fnd_login
 {
 background-image: none;
 filter:

 progid:DXImageTransform 
 .Microsoft.AlphaImageLoader(src=imagen.png,
 sizingMethod='scale');
 }
 /style
 ![endif]--


 En teoria, el ultimo pngfix creo que soportaba imagenes de
 fondo,
 pero
 no estoy muy segura...alguna idea?




 El 19 de febrero de 2009 13:16, Chr5 chr5ma...@gmail.com
 escribió:

 Buenos días compañeros,

 Intento utilizar el pngfix hack [1], para que IE6 pueda
 interpretar
 las imágenes PNG correctamente.

 Por lo visto esto funciona cuando las imágenes son incertadas
 desde
 html , pero ¿ qué ocurre cuando las imágenes son
 introducidas
 desde CSS, a través

Re: [Ovillo] Hack PNG desde CSS

2009-02-19 Por tema Mauricio Dulce
CS4 va de retro que site tan tan tan mala, fireworks es una porqueria en esa
site, va super lento, no renderiza bien, come mucho recurso y tiene un
peculiar bug con el click derecho, digamos tengo u slice que quiero exportar
le doy click derecho exportar slice selecccionado, voy a donde lo quiero
exportar le doy guardar y guala cuando doy click izquierdo en cualquier
lado, me despliega de nuevo el menu contextual

El 19 de febrero de 2009 11:31, Martin Etxauri t...@eragin.com escribió:

  En Gimp marcas el PNG como RGB (32 bits) o como indexado (8 bits) en
  el
  menú Imagen - Modo.

 Si, eso si, pero yo hablaba del truco que aparece en el link que
 mandaba Victor Hugo, donde el Fireworks, al cambiar de Indexed
 transparency a Alpha transparency permite obtener varios colores con
 alpha en un PNG de 8bits, lo cual permite tener una transparencia con
 diferentes niveles de alpha, algo que, en principio, se supone que no
 se puede hacer en un PNG de 8. Además, se comporta mejor en los
 diferentes navegadores que el PNG de 32, ya que con el truco del de 8
 bits IE 6 (e inferiores) hace desaparecer los pixeles que tienen una
 transparencia media para ponerlos completamente transparentes y (si no
 me equivoco) con el PNG de 32 bits IE pone opacos todos los pixeles
 con algo de transparencia lo cual es peor porque desaparece toda
 transparencia.

 He estado buscando algo mas y no parece que esto se pueda hacer con
 otro programa que no sea Fireworks, una pena.

 ¿Alguien tiene un Photoshop CS4 instalado para ver si hay algo de esto
 en el save for web?

 gracias

 
 
  Saludos!
 
 
 
 
  Martin Etxauri wrote:
  aupa
 
  me parece muy interesante la solución que comentan en el link.
 
  ¿alguien sabe si hay algún otro programa que ofrezca ese pequeño
  truco
  aparde de Fireworks?
 
  no puedo dar crédito a que solo se pueda hacer con Fireworks, y he
  pensado que tal vez gimp o alguno de estos lo tendría, pero en el
  Gimp
  no encuentro nada parecido
 
  ¿alguna idea?
 
  gracias
 
 
  El 19/02/2009, a las 16:12, Victor Hugo Arias Valencia escribió:
 
  Puede ser de utilidad para quien no lo sepa, el formato PNG viene en
  dos
  tipos, PNG-8 y PNG-24, por lo general utilizamos el PNG-24 y nos
  complicamos
  con el sin necesidad (como en botones e iconos), si no estoy mal el
  PNG-8 no
  tiene el problema de transparencia en Explorer 6.
  Dejo igual un artículo que explica muchisimo mejor que yo...
 
  http://www.sitepoint.com/blogs/2007/09/18/png8-the-clear-winner/
 
  El 19 de febrero de 2009 10:05, Chr5 chr5ma...@gmail.com escribió:
 
  La clase .button corresponde a imágenes contenidas dentro del
  enlace:
 
  .boton_avance a:hover .button {
  width: 44px;
  height: 49px;
  background: url(../img/playbuttons-trans.png) no-repeat 100%
  100%;
  border: none;
  }
 
  !--- html -
 
  div class=boton_avance
 a href=# title=avanzarimg class=button
  src=img/1x1.gif alt=Avance //a
  /div
 
  La parte que no interpreta es el posicionamiento a través de la
  pseudoclase :hover cuando hago rollover...
 
  background: url(../img/playbuttons-trans.png) no-repeat 100% 100%;
 
 
  El día 19 de febrero de 2009 14:52, Alvarez Laurnaga, Jose Antonio
  jalva...@softwareag.es escribió:
  Creo que tu problema es que tienes que poner:
 
  .boton_avance a.button:hover {
   width: etc.
 
  Aunque sería major ver más código HTML y css
 
  Salu2
 
  -Mensaje original-
  De: ovillo-boun...@lists.ovillo.org [mailto:
  ovillo-boun...@lists.ovillo.org] En
  nombre de Chr5
  Enviado el: jueves, 19 de febrero de 2009 14:24
  Para: Ovillo, la lista de CSS en castellano
  Asunto: Re: [Ovillo] Hack PNG desde CSS
 
  Estupendo chicos,
 
  Estoy usando esta última opción,
  todo va perfecto con imágenes ubicadas en la cabecera,
  pero algunas introducidas a través de rollover sprite[1], no
  marchan,
  están posicionadas a través de css de la siguiente manera:
 
  .boton_avance a .button {
width: 44px;
height: 49px;
background: url(../img/playbuttons-trans.png) no-repeat 100%
  0;
border: none;
  }
 
  .boton_avance a:hover .button {
width: 44px;
height: 49px;
background: url(../img/playbuttons-trans.png) no-repeat 100%
  100%;
border: none;
  }
 
 
  ¿ Algunas sugerencia ?
 
  gracias de veras a todos,
  carlos
 
  [1] http://www.alistapart.com/articles/sprites/
 
  El día 19 de febrero de 2009 12:42, Dani F. Serch
  daniou...@gmail.com escribió:
  Yo uso el IE8.js
  http://code.google.com/p/ie7-js/
 
  Y si que pueden usarse PNGs de fondo, pero la pega es que no
  pueden
  ponerse en mosaico (repetirse).
 
 
  Diana Castillo escribió:
  yo para eso suelo usar el condicional con el filter:
 
  !--[if IE]
  style
  #fnd_login
  {
  background-image: none;
  filter:
 
  progid:DXImageTransform
  .Microsoft.AlphaImageLoader(src

Re: [Ovillo] Hack PNG desde CSS

2009-02-19 Por tema Diana Castillo
A ver, todo dependerá de las necesidades.Yo utilizo en un 90% más png32 que
24. Cosa de los diseños, ya os digo.


El 19 de febrero de 2009 17:15, Félix Horro Pita fho...@corunet.comescribió:

  pero en el Gimp no encuentro nada parecido

 En Gimp marcas el PNG como RGB (32 bits) o como indexado (8 bits) en el
 menú Imagen - Modo.

 Saludos!




 Martin Etxauri wrote:
  aupa
 
  me parece muy interesante la solución que comentan en el link.
 
  ¿alguien sabe si hay algún otro programa que ofrezca ese pequeño truco
  aparde de Fireworks?
 
  no puedo dar crédito a que solo se pueda hacer con Fireworks, y he
  pensado que tal vez gimp o alguno de estos lo tendría, pero en el Gimp
  no encuentro nada parecido
 
  ¿alguna idea?
 
  gracias
 
 
  El 19/02/2009, a las 16:12, Victor Hugo Arias Valencia escribió:
 
  Puede ser de utilidad para quien no lo sepa, el formato PNG viene en
  dos
  tipos, PNG-8 y PNG-24, por lo general utilizamos el PNG-24 y nos
  complicamos
  con el sin necesidad (como en botones e iconos), si no estoy mal el
  PNG-8 no
  tiene el problema de transparencia en Explorer 6.
  Dejo igual un artículo que explica muchisimo mejor que yo...
 
  http://www.sitepoint.com/blogs/2007/09/18/png8-the-clear-winner/
 
  El 19 de febrero de 2009 10:05, Chr5 chr5ma...@gmail.com escribió:
 
  La clase .button corresponde a imágenes contenidas dentro del enlace:
 
  .boton_avance a:hover .button {
   width: 44px;
   height: 49px;
   background: url(../img/playbuttons-trans.png) no-repeat 100%
  100%;
   border: none;
  }
 
  !--- html -
 
  div class=boton_avance
  a href=# title=avanzarimg class=button
  src=img/1x1.gif alt=Avance //a
  /div
 
  La parte que no interpreta es el posicionamiento a través de la
  pseudoclase :hover cuando hago rollover...
 
  background: url(../img/playbuttons-trans.png) no-repeat 100% 100%;
 
 
  El día 19 de febrero de 2009 14:52, Alvarez Laurnaga, Jose Antonio
  jalva...@softwareag.es escribió:
  Creo que tu problema es que tienes que poner:
 
  .boton_avance a.button:hover {
width: etc.
 
  Aunque sería major ver más código HTML y css
 
  Salu2
 
  -Mensaje original-
  De: ovillo-boun...@lists.ovillo.org [mailto:
  ovillo-boun...@lists.ovillo.org] En
  nombre de Chr5
  Enviado el: jueves, 19 de febrero de 2009 14:24
  Para: Ovillo, la lista de CSS en castellano
  Asunto: Re: [Ovillo] Hack PNG desde CSS
 
  Estupendo chicos,
 
  Estoy usando esta última opción,
  todo va perfecto con imágenes ubicadas en la cabecera,
  pero algunas introducidas a través de rollover sprite[1], no
  marchan,
  están posicionadas a través de css de la siguiente manera:
 
  .boton_avance a .button {
 width: 44px;
 height: 49px;
 background: url(../img/playbuttons-trans.png) no-repeat 100% 0;
 border: none;
  }
 
  .boton_avance a:hover .button {
 width: 44px;
 height: 49px;
 background: url(../img/playbuttons-trans.png) no-repeat 100%
  100%;
 border: none;
  }
 
 
  ¿ Algunas sugerencia ?
 
  gracias de veras a todos,
  carlos
 
  [1] http://www.alistapart.com/articles/sprites/
 
  El día 19 de febrero de 2009 12:42, Dani F. Serch
  daniou...@gmail.com escribió:
  Yo uso el IE8.js
  http://code.google.com/p/ie7-js/
 
  Y si que pueden usarse PNGs de fondo, pero la pega es que no
  pueden
  ponerse en mosaico (repetirse).
 
 
  Diana Castillo escribió:
  yo para eso suelo usar el condicional con el filter:
 
  !--[if IE]
   style
   #fnd_login
   {
   background-image: none;
   filter:
 
  progid:DXImageTransform.Microsoft.AlphaImageLoader(src=imagen.png,
   sizingMethod='scale');
   }
   /style
   ![endif]--
 
 
  En teoria, el ultimo pngfix creo que soportaba imagenes de
  fondo,
  pero
  no estoy muy segura...alguna idea?
 
 
 
 
  El 19 de febrero de 2009 13:16, Chr5 chr5ma...@gmail.com
  escribió:
 
  Buenos días compañeros,
 
  Intento utilizar el pngfix hack [1], para que IE6 pueda
  interpretar
  las imágenes PNG correctamente.
 
  Por lo visto esto funciona cuando las imágenes son incertadas
  desde
  html , pero ¿ qué ocurre cuando las imágenes son
  introducidas
  desde CSS, a través de la propiedad Background-image ?
 
  ¿ Conocéis alguna solución ? ¿ Paso las imágenes desde
  background-image a
  html ?
 
  Muchas gracias como siempre por todas vuestras opiones
  sugerencias
  y
  reflexiones varias,
  carlos
 
 
  [1] http://homepage.ntlworld.com/bobosola/index.htm
  ___
  Lista de distribución Ovillo
  Para escribir a la lista, envia un correo a
  Ovillo@lists.ovillo.org
  Puedes modificar tus datos o desuscribirte en la siguiente
  dirección:
  http://lists.ovillo.org/mailman/listinfo/ovillo

Re: [Ovillo] Hack PNG desde CSS

2009-02-19 Por tema Alvarez Laurnaga, Jose Antonio
 La clase .button corresponde a imágenes contenidas dentro del enlace:
 
 .boton_avance a:hover .button {
width: 44px;
height: 49px;
background: url(../img/playbuttons-trans.png) no-repeat 100% 100%;
border: none;
 }
 
 !--- html -
 
 div class=boton_avance
   a href=# title=avanzarimg class=button
 src=img/1x1.gif alt=Avance //a
 /div
 
 La parte que no interpreta es el posicionamiento a través de la
 pseudoclase :hover cuando hago rollover...
 
  background: url(../img/playbuttons-trans.png) no-repeat 100% 100%;

Pues entonces no entiendo porqué no te funciona. Revisa la imagen porque yo he 
creado un archivo con tu código (CSS y HTML) y con un png y funciona. 
Normalmente el cambio de posición se hace hacia valores negativos (de 0 0 a 0 
-49px), pero depende de cómo este hecho el png. Si puedes subir la imagen a 
algún servidor se podría saber qué está fallando. Un truco es aumentar la 
altura de button para ver el movimiento sin que quede oculto. Eso no falla. 
Eso sí me parece que lo estás haciendo de una forma un poco retorcida ;-)
Si entiendo bien lo que quieres hacer bastaría con:

!--- html -

a href=# title=avanzar class=boton/a

!--- css -

a.boton, a.boton:hover  { 
display:block;
width: 44px;
height: 49px;   
border: 1px solid blue;
background: url(playbuttons-trans.png) no-repeat 0 0;   

 }
 a.boton:hover { 
background-position: 0 100%;
 }

Jose
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo