png behavior

PNG Behavior

Below is the complete source for the behavior. Notice that the behavior will only do anything if the user is using IE55+ on a Win32 platform.

CODE:
<public:component>
  <public:attach event="oncontentready" onevent="filterImage()" />
    <script language="jscript">
    var original = element.src;
    var spacer = "images/blank.gif";
    var htc = /MSIE ((5\.5)|[6])/.test(navigator.userAgent) && navigator.platform == "Win32";
    function filterImage() {
    if(/\.png$/.test(original) && htc) {
    element.style.visibility = 'hidden';
    var preload = new Image();
    preload.onload = function() {
        element.style.height = element.style.height ? element.style.height : this.height;
        element.style.width = element.style.width ? element.style.width : this.width;
        element.src = spacer;
        element.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=" + original + ", sizingMethod='scale', enabled='true')";
        element.style.visibility = 'visible';
    }
    preload.src = element.src;
    }
}
</script>
</public:component>


Usage

The usage is really simple. All you need to do is to add the png behavior to the image element.

<style type="text/css">

img {
   behavior: url("pngbehavior.htc");
}

</style>

14 comments:

  1. 在你一無所有的時候 是誰在陪伴你 他便是你最重要的人............................................................

    ReplyDelete
  2. 生命中最美麗的報償之一便是幫助他人的同時,也幫助了自己。.......................................................

    ReplyDelete
  3. 愛,拆開來是心和受兩個字。用心去接受對方的一切,用心去愛對方的所有。......................................................................

    ReplyDelete