PHP - PNG Transparency hack....

[Dolamite]

I read about this PNG transparency "fix" that can be done through PHP....

http://www.koivi.com/ie-png-transparency/

I've been using the javascript fix for a while now, but since it can't do background images, this seems like the only way.....

I've tried this many ways.... but I'm not a vb hacking expert so.... I was hoping maybe one of you kind people out there would have a use for this.... as it would allow a very powerful addition to VB.... allowing for easy use of High Quality PNG images with transparency in IE.... whether or not the person has javascript enabled (one of the main problems with the javascript fix)

Any help on this issue will be "greatly" appreciated

[Dolamite]

wow... no interest in this huh?

thats too bad...

[Natch]

I also have a big dislike to IE, but as a designer of a range of sites, I have to support it, and as 90% of the world still uses IE, why not just process the output of the vB rendering process thru this function ...

PHP Code:

<?php
/*
* replacePngTags - Justin Koivisto [W.A. Fisher Interactive] 7/1/2003 10:45AM
*
* Modifies IMG tags for MSIE5+ browsers to ensure that PNG-24 transparencies
* are displayed correctly. Replaces original SRC attribute with a transparent
* GIF file (spacer.gif) that is located in the same directory as the orignal
* image, and adds the STYLE attribute needed to for the browser. (Matching
* is case-insensitive.
*
* @param $x String containing the content to search and replace in.
* @result Returns the modified string.
*/
function replacePngTags($x){
    // make sure that we are only replacing for the Windows versions of Internet
    // Explorer 5+, and not Opera identified as MSIE
    $msie='/msie\s([5-9])\.?[0-9]*.*(win)/i';
    $opera='/opera\s+[0-9]+/i';
    if(!isset($_SERVER['HTTP_USER_AGENT']) ||
        !preg_match($msie,$_SERVER['HTTP_USER_AGENT']) ||
        preg_match($opera,$_SERVER['HTTP_USER_AGENT']))
        return $x;

    // OK, time to find all the IMG tags with ".png" in them
    preg_match_all('/<img.*\.png.*>/Ui',$x,$images);
    while(list($imgnum,$v)=@each($images[0])){
        $original=$v;
        $atts=''; $width=0; $height=0;
        // If the size is defined by styles, find
        preg_match_all('/style=".*(width: ([0-9]+))px.*'.
                     '(height: ([0-9]+))px.*"/Ui',$v,$arr2);
        if(is_array($arr2) && count($arr2[0])){
            // size was defined by styles, get values
            $width=$arr2[2][0];
            $height=$arr2[4][0];
        }
        // size was not defined by styles, get values
        preg_match_all('/width=\"?([0-9]+)\"?/i',$v,$arr2);
        if(is_array($arr2) && count($arr2[0])){
            $width=$arr2[1][0];
        }
        preg_match_all('/height=\"?([0-9]+)\"?/i',$v,$arr2);
        if(is_array($arr2) && count($arr2[0])){
            $height=$arr2[1][0];
        }
        preg_match_all('/src=\"([^\"]+\.png)\"/i',$v,$arr2);
        if(isset($arr2[1][0]) && !empty($arr2[1][0]))
            $image=$arr2[1][0];
        else
            $image=NULL;

        // We do this so that we can put our spacer.gif image in the same
        // directory as the image
        $tmp=split('[\\/]',$image);
        array_pop($tmp);
        $image_path=join('/',$tmp);
        if(strlen($image_path)) $image_path.='/';

        // end quote is already supplied by originial src attribute
        $replace_src_with=$image_path.'spacer.gif" style="width: '.$width.
            'px; height: '.$height.'px; filter: progidXImageTransform.'.
         'Microsoft.AlphaImageLoader(src=\''.$image.'\', sizingMethod='.
            '\'scale\')';

        // now create the new tag from the old
        $new_tag=str_replace($image,$replace_src_with,$original);

        // now place the new tag into the content
        $x=str_replace($original,$new_tag,$x);
    }
    return $x;
}
?>

or if that causes a performance hit (which it might/will for IE users), add the function itself to includes/functions.php, and add the function call manually to the individual locations where you have

<img src="someimage.png" alt="image with transparency" />

I don't see it as a big issue at all ... if IE can't handle it, then force IE to handle it ... but there is a tool to deal with it built into IE - a filter Microsoft.AlphaImageLoader which will properly render the transparency ...

originally posted on vb.com ... http://www.vbulletin.com/forum/showp...5&postcount=20

[Dolamite]

i responded to you over at vb.com....

i appreciate the info... but i'm getting errors when i try to add that code to functions.php....

any suggestions on where to put the code?

[Natch]

Working on it - I'll let you know ...

[Dolamite]

ah, that's great man.... i really appreciate it

[Dolamite]

eh guess i'll go back to using gifs until those bastards at microsoft decide to support pngs properly

[Dolamite]

i don;t suppose theres been any progress made on this?

[Zach]

Originally Posted by Dolamite

eh guess i'll go back to using gifs until those bastards at microsoft decide to support pngs properly

Yea how dare they make a browser four or five years ago and not have it support things that have become the norm since then. Jeez, didnt they look in their crystal ball or something?


Any way - I was messing with this, and actually found this thread in google - but since I was looking for something related I gave this a whirl - worked like a charm - with the instructions above - only thing I had an issue with is the spacer.png - which i just removed the path from the start of the function and placed it in the same directory as the rest of the main files and it worked no problem.


Also - after I got this one working as listed above - I then went to the original website, and grabbed his updated code - and replaced the entire function with that - this version needs no sizes defined.

[Zach]

and actually I thought I was in the other thread when I responded