额外技巧: IE版本下Xoops的PNG透明度

发布人：risto 于 2004/4/19 14:47:35 7272次阅读
自从gif存在以来，图片透明度一直是个问题。PNG的出现带来了解决方案，但不完全。由于微软的互联网浏览器（IE）无法本地处理PNG透明度。所以我们开始等待，但什么都没发生。直到……

这个小小的脚本出现了。
/* 
*   replacePngTags - Justin Koivisto [W.A. Fisher Interactive] 7/1/2003 10:45AM 
*   Modified: 4/14/2004 9:38AM 
* 
*   Modifies IMG and INPUT 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. However, the width attribute 
*   should come before height. 
* 
*   Also replaces code for PNG images specified as backgrounds via: 
*   background-image: url('image.png'); When using PNG images in the background, 
*   there is no need to use a spacer.gif image. (Only supports inline CSS at 
*   this point.) 
* 
*   @param  $x  String containing the content to search and replace in. 
*   @result Returns the modified string. 
*/ 
function replacePngTags($x){ 
    $arr2=array(); 
    // make sure that we are only replacing for the Windows versions of Internet 
    // Explorer 5+ 
    $msie='/msies([5-9]).?[0-9]*.*(win)/i'; 
    if(!isset($_SERVER['HTTP_USER_AGENT']) || 
        !preg_match($msie,$_SERVER['HTTP_USER_AGENT']) || 
        preg_match('/opera/i',$_SERVER['HTTP_USER_AGENT'])) 
        return $x; 

    // find all the png images in backgrounds 
    preg_match_all('/background-image:s*url('(.*.png)');/Uis',$x,$background); 
    for($i=0;$i<count($background[0]);$i++){ 
        // simply replace: 
        //  "background-image: url('image.png');" 
        // with: 
        //  "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader( 
        //      enabled=true, sizingMethod=scale src='image.png');" 
        // haven't tested to see if background-repeat styles work... 
        $x=str_replace($background[0][$i],'filter:progid:DXImageTransform.'. 
                'Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale'. 
                ' src=''.$background[1][$i].'');',$x); 

    } 

    // OK, time to find all the IMG tags with ".png" in them 
    preg_match_all('/<(input|img).*src=(\'|\")(.*.png)2.*>/Ui',$x,$images); 
    for($num_images=0;$num_images$images[0]);$num_images++){ 
        $original=$images[0][$num_images]; 
        $quote=$images[2][$num_images]; 
        $atts=''; $width=0; $height=0; 
        // If the size is defined by styles, find 
        preg_match_all( 
            '/style=(\'|\").*(s?width:s?([0-9]+(px|%));).*'. 
            '(s?height:s?([0-9]+(px|%));).*\1/Ui', 
            $images[0][$num_images],$arr2); 
        if(is_array($arr2) && count($arr2[0])){ 
            // size was defined by styles, get values 
            $width=$arr2[3][0]; 
            $height=$arr2[6][0]; 

            // remove the width and height from the style 
            $stripper=str_replace(' ','s','/('.$arr2[2][0].'|'.$arr2[5][0].')/'); 
            // Also remove any empty style tags 
            $modified=preg_replace( 
                '`style='.$arr2[1][0].$arr2[1][0].'`i', 
                '', 
                preg_replace($stripper,'',$original)); 
        } 
        // size was not defined by styles, get values 
        preg_match_all('/width=(\'|\")?([0-9%]+)\1/i',$images[0][$num_images],$arr2); 
        if(is_array($arr2) && count($arr2[0])){ 
            $width=$arr2[2][0]; 
            if(is_numeric($width)) 
                $width.='px'; 

            // remove this from the tag 
            $modified=str_replace($arr2[0][0],'',$original); 
        } 
        preg_match_all('/height=(\'|\")?([0-9%]+)\1?/i',$images[0][$num_images],$arr2); 
        if(is_array($arr2) && count($arr2[0])){ 
            $height=$arr2[2][0]; 
            if(is_numeric($height)) 
                $height.='px'; 

            // remove this from the tag 
            $modified=str_replace($arr2[0][0],'',$modified); 
        } 

        preg_match_all('/src=(\'|\")([^"]+.png)\1/i',$images[0][$num_images],$arr2); 
        if(isset($arr2[2][0]) && !empty($arr2[1][0])) 
            $image=$arr2[2][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'.$quote.' style="width: '.$width. 
            '; height: '.$height.'; filter: progid:DXImageTransform.'. 
            'Microsoft.AlphaImageLoader(src=''.$image.'', sizingMethod='. 
            ''scale');"'; 

        // now create the new tag from the old 
        $new_tag=str_replace($image.$quote,$replace_src_with, 
            str_replace('  ',' ',$modified)); 

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


如果您现在想让Xoops网站在IE上实现PNG透明度，您需要进行以下操作。
1) 将上述代码保存为根目录下的functions.php。
2) 打开同一位置下的header.php文件，并在文件开头添加以下代码
include_once XOOPS_ROOT_PATH.'/function.php';
    ob_start();

3) 打开同一位置下的footer.php文件，并在文件结尾处添加以下代码
$x=ob_get_contents();
    ob_end_clean();
    echo replacePngTags($x);

就是这样。一切都完成了。现在您已经在Xoops网站上为IE启用了PNG透明度。