`
yong7181000
  • 浏览: 29931 次
  • 性别: Icon_minigender_1
  • 来自: 西安
社区版块
存档分类
最新评论

Microsoft.AlphaImageLoader 滤镜

阅读更多

很多大型网站上都使用到了这个滤镜,它是IE滤镜的一种,其主要作用就是对图片进行透明处理。虽然FireFox和IE7以上的IE浏览器已经支持透明的PNG图片,但是就IE5-IE6而言还是有一定的意义。
语法:

filter : progid:DXImageTransform.Microsoft.AlphaImageLoader ( enabled=bEnabled , sizingMethod=sSize , src=sURL )

属性:
enabled  :  可选项。布尔值(Boolean)。设置或检索滤镜是否激活。

true  :  默认值。滤镜激活。 false  :  滤镜被禁止。 
sizingMethod  :  可选项。字符串(String)。设置或检索滤镜作用的对象的图片在对象容器边界内的显示方式。

crop  :  剪切图片以适应对象尺寸。 
image  :  默认值。增大或减小对象的尺寸边界以适应图片的尺寸。 
scale  :  缩放图片以适应对象的尺寸边界。 
src  :  必选项。字符串(String)。使用绝对或相对 url 地址指定背景图像。假如忽略此参数,滤镜将不会作用。

特性:
Enabled  :  可读写。布尔值(Boolean)。参阅 enabled 属性。 
sizingMethod  :  可读写。字符串(String)。参阅 sizingMethod 属性。 
src  :  可读写。字符串(String)。参阅 src 属性。

说明:
在对象容器边界内,在对象的背景和内容之间显示一张图片。并提供对此图片的剪切和改变尺寸的操作。如果载入的是PNG(Portable Network Graphics)格式,则0%-100%的透明度也被提供。
PNG(Portable Network Graphics)格式的图片的透明度不妨碍你选择文本。也就是说,你可以选择显示在PNG(Portable Network Graphics)格式的图片完全透明区域后面的内容。

示例:
#idDiv{position:absolute; left:140px; height:400; width:400;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='rain1977.gif',sizingMethod='scale');}
.dream{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/earglobe.gif');}

P.S. 当想使用backgroundimage属性时,如果不想让图片原尺寸显示,而是类似于IMG width=100% heigth=100% 的效果,可以通过此filter实现。

Example:
span.style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src='test.jpg', sizingMethod='scale')";

引用:最后说说关于FF和IE效果调和问题。这个滤镜效果只适用于IE,在FF下面无法显示,我想这是前辈说他很难实现的最终问题了。以往我们用*或者_来修复IE下和FF的区别.这一次是要找方法修复FF不能实现的问题.
其实想到的话,也很简单了.就是先让FF正常显示该图片,然后,用*或_ 来清除IE下的显示效果,最后用*或_ 来做以上的滤镜效果。大功告成!

以上是官方的说明。事实上实际操作中需要注意:AlphaImageLoader滤镜会导致该区域的链接和按钮无效,一般情况下的解决办法是为链接或按钮添加:position:relative使其相对浮动要注意的是,当加载滤镜的区域的父层有position:absolute绝对定位的时候使用position:relative也不能使链接复原。建议使用浮动办法处理。
具体操作:

为预览区域(比如要在某个 div 中预览)添加样式:filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale);。 
为 AlphaImageLoader 设置 src 属性。

MSDN原文

 
分享到:
评论

相关推荐

    firefox和IE系列的相关区别整理 以备后用

    png透明 AlphaImageLoaderfilter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=bEnabled,sizingMethod=sSize,src=sURL) enabled:可选项。布尔值(Boolean)。设置或检索滤镜是否激活。true:默认值。...

    背景图片自动调整大小

    很多大型网站上都使用到了这个滤镜,它是IE滤镜的一种,其主要作用就是对图片进行透明处理。...filter : progid:DXImageTransform.Microsoft.AlphaImageLoader ( enabled=bEnabled , sizingMethod=sSize , src=sURL )

    JAVASCRIPT IE 与 FF中兼容问题小结

    png透明 AlphaImageLoaderfilter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=bEnabled,sizingMethod=sSize,src=sURL)enabled:可选项。布尔值(Boolean)。设置或检索滤镜是否激活。true:默认值。...

    IE6下PNG图片透明问题解决方案集锦

    1、滤镜filter : progid:DXImageTransform.Microsoft.AlphaImageLoader ( enabled=bEnabled , sizingMethod=sSize , src=sURL )属性: enabled:可选项。布尔值(Boolean)。设置或检索滤镜是否激活。true | falsetrue...

    javascript IE7 浏览器本地图片预览

    语法: filter : progid:DXImageTransform.Microsoft.AlphaImageLoader ( enabled=bEnabled , sizingMethod=sSize , src=sURL ) enabled:可选项。布尔值(Boolean)。设置或检索滤镜是否激活。 true:默认值。滤镜...

    png在IE6 下无法透明的解决方法汇总

    style=”FILTER: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/fl.png’)” 语法: filter : progid:DXImageTransform.Microsoft.AlphaImageLoader ( enabled=bEnabled , sizingMethod=sSize , ...

    用滤镜实现背景图片的拉伸效果代码

    复制代码代码如下: body{FILTER: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,src=’0921.jpg’ ,sizingMethod=’scale’) }

    IE6兼容png24透明滤镜写法 图片路径是以页面为基点

    代码很简单: ..._filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=’logo2.png’); 注意:滤镜的图片路径是以页面为基点,并非以CSS文件。 另,此方法不支持背景图片平铺,根据需要使用。

    DD_belatedPNG解决IE6不支持PNG绝佳方案

    这个js插件使用了微软的VML语言进行绘制,而其他多数解决PNG问题的js插件用的是AlphaImageLoader滤镜. 使用方法 1.在这里下载DD_belatedPNG.js文件. 2.在网页中引用,如下: <!--[if IE 6]> [removed][removed] ...

    IE6 PNG 透明

    我们知道IE6是不支持透明的PNG的,这无疑限制了网页设计的发挥空间. 然而整个互联网上解决这个IE6的透明PNG的方案也...这个js插件使用了微软的VML语言进行绘制,而其他多数解决PNG问题的js插件用的是AlphaImageLoader滤镜

    ie8本地图片上传预览示例代码

    document.getElementById(“divSBTP”).style.filter=”progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=’true’,sizingMethod=’scale’,src=\””+ imgpath + “\”)”;//使用滤镜效果 function ...

    IE6下Png透明最佳解决方案DD_belatedPNG

    这个问题曾经困扰我许久许久……曾经一度的采用滤镜的方法搞定这个问题,但是这种方法有个弊端...这个js插件使用了微软的VML语言进行绘制,而其他多数解决PNG问题的js插件用的是AlphaImageLoader滤镜. 使用方法 1.点击

Global site tag (gtag.js) - Google Analytics