转: 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形式的地图展示,可以自行绘制图形,高亮区 ...
随机推荐
- 从51跳cortex-m0学习2——程序详解
跳cortex-m0——思想转变>之后又一入门级文章,在此不敢请老鸟们过目.不过要是老鸟们低头瞅了一眼,发现错误,还请教育之,那更是感激不尽.与Cortex在某些操作方式上的异同,让自己对Cor ...
- Create screenshots of a web page using Python and QtWebKit | Roland's Blog
Create screenshots of a web page using Python and QtWebKit | Roland's Blog Create screenshots of a w ...
- CCPC A(模拟)
Secrete Master Plan Time Limit: 3000/1000MS (Java/Others) Memory Limit: 65535/65535KB (Java/Othe ...
- Linux下shell编程实例
1. 推断一文件是不是块或字符设备文件.假设是将其复制到 /dev 文件夹下 read -p "input a file:" filename if [ -b $filename ...
- QQ聊天原理初识
1:qq之间文件的传输是通过p2p通信进行的. 2:qq之间的表情发送实际上就是文字的发送,是client再接受到文字之后在本地自己进行转换 3:qq之间的通信既能够通过udp也能够通过Tcp 尽管u ...
- 【转】KVM/Installation
[转]KVM/Installation Installation Pre-installation checklist Check that your CPU supports hardware vi ...
- ios7以上自定义导航栏标题的字体大小及颜色的方法
自定义导航栏的字体和颜色,只需要自定义一个lable,然后将lable添加到导航栏的titleview中就可以了 代码如下 UILabel *label = [[UILabel alloc] init ...
- 经典排序算法及python实现
今天我们来谈谈几种经典排序算法,然后用python来实现,最后通过数据来比较几个算法时间 选择排序 选择排序(Selection sort)是一种简单直观的排序算法.它的工作原理是每一次从待排序的数据 ...
- guava中eventbus注解使用
guava是 google 几个java核心类库的集合,包括集合.缓存.原生类型.并发.常用注解.基本字符串操作和I/O等等.学会使用该库相关api的使用,能使我们代码更简洁,更优雅,本章节我们来谈谈 ...
- lightOJ 1047 Neighbor House (DP)
lightOJ 1047 Neighbor House (DP) 题目链接:http://acm.hust.edu.cn/vjudge/contest/view.action?cid=87730# ...