RE: [WSG] PNG in IE6

2008-02-21 Thread Tim MacKay 
I wholeheartedly second this suggestion. This solution works brilliantly. As KM 
wrote below:

http://www.twinhelix.com/css/iepngfix/

I originally found it via this site which has a friendly introduction to the 
concept:

http://bjorkoy.com/past/2007/4/8/the_easiest_way_to_png/

One problem you will encounter is that if a link is placed over something that 
uses this filter as a background image the link will be inactive. There is a 
solution here: http://www.satzansatz.de/cssd/tmp/alphatransparency.html (start 
at 'Problem: Link's don't work').

Cheers,

Tim


-Original Message-
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of kevin mcmonagle
Sent: Friday, 22 February 2008 2:17 AM
To: wsg@webstandardsgroup.org
Subject: Re: [WSG] PNG in IE6

If its not a repeating background this is the easiest way to get png 
support:

http://www.twinhelix.com/css/iepngfix/

-best
kevin



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

Re: [WSG] PNG in IE6

2008-02-21 Thread David Hucklesby 
On Thu, 21 Feb 2008 09:30:08 -0600, Tim Palac wrote:

> Why not just use http://dean.edwards.name/IE7/ as the plugin to display your 
> PNG?  That
> way, if people are using IE6 with Javascript enabled, you can add png 
> functionality,
> advanced CSS support, etc. I know Eric Meyer personally endorses this method 
> (well at
> least he did at An Event Apart) and I've used it before with much success.
>

Good solution.

Dean has just updated IE7.js to conform to the real IE 7, which
should save us all a ton of grief:

 

Then there is IE8.js ...

 

Cordially,
David
--



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

Re: [WSG] PNG in IE6

2008-02-21 Thread Tim Palac 
Why not just use http://dean.edwards.name/IE7/ as the plugin to display your
PNG?  That way, if people are using IE6 with Javascript enabled, you can add
png functionality, advanced CSS support, etc. I know Eric Meyer personally
endorses this method (well at least he did at An Event Apart) and I've used
it before with much success.

Tim
AIM: TymArtist
http://www.timpalac.com

On Thu, Feb 21, 2008 at 4:07 AM, Amrinder <[EMAIL PROTECTED]>
wrote:

>  Hi
>
> I looked for the working of .png image in internet explorer and found two
> articles.
> http://webfx.eae.net/dhtml/pngbehavior/pngbehavior.html
> http://www.alistapart.com/articles/pngopacity
> I tried using *'filter' *according to both these articles but can't got a
> way.
> Following is the HTML code:
> 
>  
> 
> 
> 
>
> The css code for #extradiv1 is:
>
> #extradiv1 {
>  background-image: url(../images/logo.gif);
>  background-attachment: scroll;
>  background-repeat: no-repeat;
>  background-position: center top;
>  position:relative;
>  height: 129px;
>  width: 120px;
>  filter: 
> progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../image/logo.png',
> sizingMethod='scale');
>  margin: 0 auto;
> }
>
> Please help.
>
> Kind Regards,
> Amrinder www.awayback.com
>
> ***
> List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
> Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
> Help: [EMAIL PROTECTED]
> ***


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

Re: [WSG] PNG in IE6

2008-02-21 Thread kevin mcmonagle 
If its not a repeating background this is the easiest way to get png 
support:


http://www.twinhelix.com/css/iepngfix/

-best
kevin



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

Re: [WSG] PNG in IE6

2008-02-21 Thread Svip 
My preferred method is shrugging at the IE6 users and just let them
see their own browser rendering PNGs as ugly as it can.

/Svip

On 21/02/2008, [EMAIL PROTECTED] <[EMAIL PROTECTED]> wrote:
>
>
>
> Good time of day.
>
>
>
>
> 1. Your mistake:
>
> Addressing in Filter is from your html, not from your css.
>
>
>
>
> 2. Ordinary way to support png, in my practice, is next:
>
>
>
>
> With hack:
>
>
>
>
> css/element.css
>
> css/element_ie.css
>
> images/logo.png
>
> index.html
>
>
>
>
> index.html:
>
> --
>
> 
>
> ...
>
> 
>
> 
>
> 
>
> 
>
> 
>
>
>
>
> element.css
>
> ---
>
> #extradiv1{
>
>  background-image: url(../images/logo.png);
>
>  background-attachment: scroll;
>
>  background-repeat: no-repeat;
>
>  background-position: center top;
>
>  position:relative;
>
>  height: 129px;
>
>  width: 120px;
>
>  margin: 0 auto;
>
> }
>
>
>
>
> * html #extradiv1{
>
> background: none;
>
> filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/logo.png',
> sizingMethod='scale');
>
> }
>
>
>
>
> Without hack:
>
>
>
>
> css/element.css
>
> css/element_ie.css
>
> images/logo.png
>
> index.html
>
>
>
>
> index.html:
>
> --
>
> 
>
> 
>
> ...
>
> 
>
> 
>
> 
>
> 
>
> 
>
>
>
>
> element.css
>
> ---
>
> #extradiv1{
>
>  background-image: url(../images/logo.png);
>
>  background-attachment: scroll;
>
>  background-repeat: no-repeat;
>
>  background-position: center top;
>
>  position:relative;
>
>  height: 129px;
>
>  width: 120px;
>
>  margin: 0 auto;
>
> }
>
>
>
>
> element_ie.css
>
> 
>
> #extradiv1{
>
> background: none;
>
> filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/logo.png',
> sizingMethod='scale');
>
> }
>
>
>
>
>
>
>
> This should work.
>
>
>
>
> __
>
>
>
>
> Raven. Night folk studio.
>
> http://nightfolk.net/
>
> ***
> List Guidelines:
> http://webstandardsgroup.org/mail/guidelines.cfm
> Unsubscribe:
> http://webstandardsgroup.org/join/unsubscribe.cfm
> Help: [EMAIL PROTECTED]
> ***


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

Re: [WSG] PNG in IE6

2008-02-21 Thread raven 




Good time of day.

1. Your mistake:
Addressing in Filter is from your html, not from your css.

2. Ordinary way to support png, in my practice, is next:

With hack:

css/element.css
css/element_ie.css
images/logo.png
index.html

index.html:
--

...

    
    
    


element.css
---
#extradiv1{
 background-image: url(../images/logo.png);
 background-attachment: scroll;
 background-repeat: no-repeat;
 background-position: center top;
 position:relative;
 height: 129px;
 width: 120px;
 margin: 0 auto;
}

* html #extradiv1{
background: none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='', sizingMethod='scale'); 
}

Without hack:

css/element.css
css/element_ie.css
images/logo.png
index.html

index.html:
--

        
...

    
    
    


element.css
---
#extradiv1{
 background-image: url(../images/logo.png);
 background-attachment: scroll;
 background-repeat: no-repeat;
 background-position: center top;
 position:relative;
 height: 129px;
 width: 120px;
 margin: 0 auto;
}

element_ie.css

#extradiv1{
background: none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='', sizingMethod='scale'); 
}


This should work.

__

Raven. Night folk studio.
http://nightfolk.net/




***List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfmUnsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfmHelp: [EMAIL PROTECTED]***

Re: [WSG] PNG in IE6

2008-02-21 Thread Matt Fellows 
If you have Adobe CS, you can try exporting the PNG image as PNG-8.

Cheers,

Matt
http://www.onegeek. com.au


On 2/21/08, Amrinder <[EMAIL PROTECTED]> wrote:
>
>
> Hi
>
> I looked for the working of .png image in internet explorer and found two
> articles.
> http://webfx.eae.net/dhtml/pngbehavior/pngbehavior.html
> http://www.alistapart.com/articles/pngopacity
> I tried using 'filter' according to both these articles but can't got a
way.
>
> Following is the HTML code:
> 
>  
> 
> 
> 
>
> The css code for #extradiv1 is:
>
> #extradiv1 {
>  background-image: url(../images/logo.gif);
>  background-attachment: scroll;
>  background-repeat: no-repeat;
>  background-position: center top;
>  position:relative;
>  height: 129px;
>  width: 120px;
>  filter:
> progid:DXImageTransform.Microsoft.AlphaImageLoader
(src='../image/logo.png',
> sizingMethod='scale');
>  margin: 0 auto;
> }
>
> Please help.
>
> Kind Regards,
> Amrinder www.awayback.com
> ***
> List Guidelines:
> http://webstandardsgroup.org/mail/guidelines.cfm
> Unsubscribe:
> http://webstandardsgroup.org/join/unsubscribe.cfm
> Help: [EMAIL PROTECTED]
> ***


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***