Microsoft.AlphaImageLoader滤镜讲--透明处理<转>
Microsoft.AlphaImageLoader是IE滤镜的一种,其主要作用就是对图片进行透明处理。虽然FireFox和IE7以上的IE浏览器已经支持透明的PNG图片,但是就IE5-IE6而言还是有一定的意义。
| enabled | : | 可选项。布尔值(Boolean)。设置或检索滤镜是否激活。true | false
|
|||||||||
| sizingMethod | : | 可选项。字符串(String)。设置或检索滤镜作用的对象的图片在对象容器边界内的显示方式。
|
|||||||||
| src | : | 必选项。字符串(String)。使用绝对或相对 url 地址指定背景图像。假如忽略此参数,滤镜将不会作用。 |
| Enabled | : | 可读写。布尔值(Boolean)。参阅 enabled 属性。 |
| sizingMethod | : | 可读写。字符串(String)。参阅 sizingMethod 属性。 |
| src | : | 可读写。字符串(String)。参阅 src 属性。 |
PNG(Portable Network Graphics)格式的图片的透明度不妨碍你选择文本。也就是说,你可以选择显示在PNG(Portable Network Graphics)格式的图片完全透明区域后面的内容。
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 属性。
Microsoft.AlphaImageLoader滤镜讲--透明处理<转>的更多相关文章
- Microsoft.AlphaImageLoader滤镜讲解
Microsoft.AlphaImageLoader是IE滤镜的一种,其主要作用就是对图片进行透明处理.虽然FireFox和IE7以上的IE浏览器已经支持透明的PNG图片,但是就IE5-IE6而言还是 ...
- Microsoft.AlphaImageLoader滤镜解说
Microsoft.AlphaImageLoader是IE滤镜的一种,其主要作用就是对图片进行透明处理.尽管FireFox和IE7以上的IE浏览器已经支持透明的PNG图片,可是就IE5-IE6而言还是 ...
- 转:alphaImageLoader滤镜加载后 链接不能点击
我是一个很少使用IE滤镜,也是一个不赞成使用IE滤镜的前端工程师.不过今天有一个朋友给我发来了一个有关于IE6的BUG,就是在IE6中使用了AlphaPNG透明的IE滤镜之后,a链接不能够点击.具体情 ...
- 关于ie6中使用css滤镜[_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/*.png',sizingMethod='scale')]后链接无法点击的问题
RT,我做的一个效果是试用png图做背景,通过_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/*.png' ...
- filter : progid:DXImageTransform.Microsoft.AlphaImageLoader ( enabled=bEnabled , sizingMethod=sSize , src=sURL )
很多时候需要将图片显示在网页上,一般都会这样做,如下: <img src="xxx.jpg"/> 是的,这样是可以做到,但是如果我要将本地的图片显示到页面上呢?你可能会 ...
- Microsoft.AlphaImageLoader过滤评论
Microsoft.AlphaImageLoader是IE滤镜的一种,其主要作用就是对图片进行透明处理.尽管FireFox和IE7以上的IE浏览器已经支持透明的PNG图片,可是就IE5-IE6而言还是 ...
- 【IE6的疯狂之十三】IE6下使用滤镜后链接不能点击的BUG
大家可能都知道IE6下使用DXImageTransform.Microsoft.AlphaImageLoader滤镜(用于PNG32 Alpha透明)后链接不能点击的BUG,大家也都知道只要在a标签上 ...
- filter IE滤镜(Internet Explorer)CSS
收集一些IE滤镜,留作之后开发用. 透明度 #myElement { opacity: .; /* other browsers */ filter: progid: DXImageTransform ...
- JS魔法堂之实战:纯前端的图片预览
一.前言 图片上传是一个普通不过的功能,而图片预览就是就是上传功能中必不可少的子功能了.在这之前,我曾经通过订阅input[type=file]元素的onchange事件,一旦更改路径则将图片上传至服 ...
随机推荐
- Lucene打分规则与Similarity模块详解
搜索排序结果的控制 Lucnen作为搜索引擎中,应用最为广泛和成功的开源框架,它对搜索结果的排序,有一套十分完整的机制来控制:但我们控制搜索结果排序的目的永远只有一个,那就是信息过滤,让用户快速,准确 ...
- Node.js学习系列1
概述 最近在刷javascript的技能,觉着nodejs是个不错的入口,作为一个.Net平台的前端工程师学习使用js开发服务端,想想都有点小激动哈哈^_^^_^. 入门 之前开发过ionic,所以对 ...
- 设计模式之适配器模式(Decorator)
1.意图 动态地给一个对象添加一些额外的功能. 2.适用性 动态.透明的方式给单个对象添加职责. 如果不适合适用子类来进行扩展的时候,可以考虑适用装饰模式. 避免子类数目爆炸性增长. 3.结构 4.参 ...
- mysql学习(七)-索引学习
常规索引: 在常用查询的字段上使用常规索引 创建表时一块创建索引 create table if not exists carshop(id int not null auto_increment, ...
- oracle中sql查询语句的执行顺序
查询语句的处理过程主要包含3个阶段:编译.执行.提取数据(sql查询语句的处理主要是由用户进程和服务器进程完成的,其他进程辅助配合) 一.编译parse 在进行编译时服务器进程会将sql语句的正文放入 ...
- Django模板-模板标签
接着Django模板-基础知识继续写模板相关知识. if标签 {% if %} 标签接受 and , or 或者 not 关键字来对多个变量做判断 ,或者对变量取反( not ). 但是不允许在同一个 ...
- php安全编程—sql注入攻击
php安全编程--sql注入攻击 定义 SQL注入攻击指的是通过构建特殊的输入作为参数传入Web应用程序,而这些输入大都是SQL语法里的一些组合,通过执行SQL语句进而执行攻击者所要的操作,其主要原因 ...
- linux配置jdk环境详解
环境:Redhat Server 5.1(虚拟机) 工具:Xftp4 jdk-7-linux-i586.rpm文件 步骤1:把jdk-7-linux-i586.rpm文件拷贝到/usr/local目 ...
- SQL顺序列找出断号
select id from info id-----------123567810111215 (11 行受影响) 方法一: select (select max(id)+1 from Info w ...
- HTML5 服务器发送事件(Server-Sent Events)介绍
w3cschool菜鸟教程 Server-Sent 事件 - 单向消息传递 Server-Sent 事件指的是网页自动获取来自服务器的更新. 以前也可能做到这一点,前提是网页不得不询问是否有可用的更新 ...