Cookbook /
PngAlphaIE
Summary: Steps for displaying PNG images with 8bit alpha transparency
Version: 0.1 18 Mar 2006
Prerequisites: None
Status: Limited testing
Maintainer: zkarj
Categories: Images
Questions answered by this recipe
- How can I make Internet Explorer (on Windows) display transparency properly?
Description
Add the following lines to local/config.php
if ((strpos($_SERVER['HTTP_USER_AGENT'], 'MSIE') !== FALSE) && (strpos($_SERVER['HTTP_USER_AGENT'], 'Mac_') == FALSE)) { $UseAlphaFilter = 1; } else { $UseAlphaFilter = 0; }
This allows for detecting the IE browsers that cannot cope natively with 8bit transparency.
Use the following markup to include the image.
(:if !enabled UseAlphaFilter:) Attach:trans.png (:if enabled UseAlphaFilter:) (:div id='png1' style='[=width:300px; height:200px; padding:0px; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="http://www.mysite.com/uploads/Main/trans.png", sizingMethod="image")=]':) (:divend:) (:if:)
Elements that you will need to change to suit your own situation are:
- The name of the image (trans.png above) on the Attach: and in the URL.
- The width= and height= values should match your image dimensions.
- The main part of the URL will need to reflect your site and the location of the image. In this case, the example page is in the Main group.
Notes
- Tested with Firefox 1.5 and IE 6.0 on Windows XP SP2.
- I have tested this only with a start-of-line unfloated image. It may be possible to add additional markup to allow floating (on both Attach: and (:div:)).
- There may be a better way to specify the URL - i.e. in relative form and maybe using variables to automatically locate the correct folder.
Release Notes
Comments
See Also
Contributors
User notes? : If you use, used or reviewed this recipe, you can add your name. These statistics appear in the Cookbook listings and will help newcomers browsing through the wiki.