正在载入……

Attention, Zin 的交互设计之路。

User interface, user experience and interactive design.

« Yahoo开始测试对OpenID的支持不得不转-八旬老人无人赡养靠乞讨为生 [视频] »

IE6下滤镜插入透明PNG背景,解决失焦问题

在IE6或更低版本的浏览器插入PNG图片需要用到私有的滤镜,但是这样实现的背景图,会造成内容失焦,就是点不到背景之上的内容,可以使用css定义位置相对来解决。
CSS:

html>body #flash {
  background: url(images/page.png) no-repeat;
}
* html #flash {
  filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/page.png',sizingMethod='image');
}
#cont{
  position:relative;
}


XHTML:

<div id="flash">
      <div id="cont">这里插入动画</div>
</div>


这里flash设置了wmode为transparent实现背景透明,这样动画中的按钮就不会点不到了。

UPDATE:2008-01-25
IE6将于2008年2月12日彻底退出历史舞台,微软将强制更新所有Windows的IE6,而无需经过用户同意,微软称这是出于安全考虑,那对于Web前端开发者来说是一个非常大的好消息,在开发时候只需要考虑IE7与其他浏览器的兼容,而且IE7对web标准的支持有很大的进步,同时,这篇文章里的透明png问题也不用这么麻烦了,直接用background的就行了。但随之而来的将是一批支持IE6为主的网站的改版 - -//

欢迎发表看法:

您的讨论更有价值!

控制面板

<< 2008-11 >>

Sun

Mon

Tue

Wed

Thu

Fri

Sat

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

最近留言