转: AlphaImageLoader简介
Microsoft.AlphaImageLoader是IE滤镜的一种,其主要作用就是对图片进行透明处理。虽然FireFox和IE7以上的IE浏览器已经支持透明的PNG图片,但是就IE5-IE6而言还是有一定的意义。
~~~AlphaImageLoader滤镜一般用来解决IE6不支持png图片透明度的问题,但除此之外,还可以实现本地图片预览的需求
//AlphaImageLoader实现预览 关键点: AlpahaImageLoader src=本地路径 加载的是客户端文件系统的本地路径
AlphaImageLoader加载的图片位于 容器背景和内容之间
例子:
$('#p_prev,#p_up').each(function(i, ele, eles){
this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale);";
this.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = fpath;
if(this.id == 'p_prev') this.src = 'images/blank320_320.gif';
});
| 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)格式的图片完全透明区域后面的内容。
.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')";
实际操作中需要注意:AlphaImageLoader滤镜会导致该区域的链接和按钮无效,
一般情况下的解决办法是为链接或按钮 添加:position:relative使其相对浮动 要注意的是,当加载滤镜的区域的父层有position:absolute绝对定位的时候使用position:relative也不能使链接复原。建议 使用浮动办法处理。
具体操作:
- 为预览区域(比如要在某个 div 中预览)添加样式:filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale);。
- 为 AlphaImageLoader 设置 src 属性。
转: AlphaImageLoader简介的更多相关文章
- ASP.NET Core 1.1 简介
ASP.NET Core 1.1 于2016年11月16日发布.这个版本包括许多伟大的新功能以及许多错误修复和一般的增强.这个版本包含了多个新的中间件组件.针对Windows的WebListener服 ...
- MVVM模式和在WPF中的实现(一)MVVM模式简介
MVVM模式解析和在WPF中的实现(一) MVVM模式简介 系列目录: MVVM模式解析和在WPF中的实现(一)MVVM模式简介 MVVM模式解析和在WPF中的实现(二)数据绑定 MVVM模式解析和在 ...
- Cassandra简介
在前面的一篇文章<图形数据库Neo4J简介>中,我们介绍了一种非常流行的图形数据库Neo4J的使用方法.而在本文中,我们将对另外一种类型的NoSQL数据库——Cassandra进行简单地介 ...
- REST简介
一说到REST,我想大家的第一反应就是“啊,就是那种前后台通信方式.”但是在要求详细讲述它所提出的各个约束,以及如何开始搭建REST服务时,却很少有人能够清晰地说出它到底是什么,需要遵守什么样的准则. ...
- Microservice架构模式简介
在2014年,Sam Newman,Martin Fowler在ThoughtWorks的一位同事,出版了一本新书<Building Microservices>.该书描述了如何按照Mic ...
- const,static,extern 简介
const,static,extern 简介 一.const与宏的区别: const简介:之前常用的字符串常量,一般是抽成宏,但是苹果不推荐我们抽成宏,推荐我们使用const常量. 执行时刻:宏是预编 ...
- HTTPS简介
一.简单总结 1.HTTPS概念总结 HTTPS 就是对HTTP进行了TLS或SSL加密. 应用层的HTTP协议通过传输层的TCP协议来传输,HTTPS 在 HTTP和 TCP中间加了一层TLS/SS ...
- 【Machine Learning】机器学习及其基础概念简介
机器学习及其基础概念简介 作者:白宁超 2016年12月23日21:24:51 摘要:随着机器学习和深度学习的热潮,各种图书层出不穷.然而多数是基础理论知识介绍,缺乏实现的深入理解.本系列文章是作者结 ...
- Cesium简介以及离线部署运行
Cesium简介 cesium是国外一个基于JavaScript编写的使用WebGL的地图引擎,一款开源3DGIS的js库.cesium支持3D,2D,2.5D形式的地图展示,可以自行绘制图形,高亮区 ...
随机推荐
- [转]IOS Segment页面之间view的切换
有三个view,分别为view1.view2.view3,通过UISegmentedControl进行三个view的切换. @interface UIViewDemoViewController : ...
- 名叫Florida的女孩问题
近读列纳德·蒙洛迪诺的<醉汉的脚步>,读到第六章,作者举了一个超级变态的例子来解释条件概率或者说是贝叶斯概率. 1.先来看一个简单点的问题:已知所有有2个孩子的家庭,其中一个家庭2个孩子都 ...
- 射频识别技术漫谈(13)——Mifare S50与Mifare S70
Mifare S50和Mifare S70又常被称为Mifare Standard.Mifare Classic.MF1,是遵守ISO14443A标准的卡片中应用最为广泛.影响力最大的的一员.而Mif ...
- FMX相当于在界面上自己又做了一个小操作系统
FMX的自画界面我也不看好,比如复制粘贴,太丑了,系统做得很好很精细的复制粘贴界面,就是无法调出,比如MIUI,复制粘贴还能有个放大镜,可以选择到屏幕边缘的文字,可以选择剪贴板内多个可粘贴的文字:还有 ...
- 使用 RMI + ZooKeeper 实现远程调用框架
目录[-] 1 发布 RMI 服务1.1 定义一个 RMI 接口1.2 编写 RMI 接口的实现类1.3 通过 JNDI 发布 RMI 服务2 调用 RMI 服务3 RMI 服务的局限性4 使用 Zo ...
- BZOJ 3038 上帝造题的七分钟2 (并查集+树状数组)
题解:同 BZOJ 3211 花神游历各国,需要注意的是需要开long long,还有左右节点需要注意一下. #include <cstdio> #include <cmath> ...
- A计划(bfs)
A计划 Time Limit : 3000/1000ms (Java/Other) Memory Limit : 32768/32768K (Java/Other) Total Submissio ...
- The document "ViewController.xib" could not be opened. Could not read archive.
The document "ViewController.xib" could not be opened. Could not read archive. Please use ...
- Android蓝牙开发深入解析
1. 使用蓝牙的响应权限 代码如下: <uses-permission android:name="android.permission.BLUETOOTH" /> ...
- 关于移动端 rem 布局的一些总结
[资源一]基础知识恕不回顾 基础知识参考以下两篇博客: http://isux.tencent.com/web-app-rem.html http://www.w3cplus.com/css3/def ...