记录 IE 下一些奇妙的 BUG

1. IE6 下超链接的 JavaScript 事件导致 Gif 图片停止动画

在之前的某个项目中遇到一个奇怪的 BUG,需求方说 Loading Gif 不会动了,由于以前没遇到过,想也没多想就说回 Gif 不像 .swf 文件那样可以带参数控制,除了页面卡点,可能播放不流畅,怎么可能停止呢?

后面测试了一下,果然在 IE6 下有这个问题。谷歌之,原来是 IE6 下的一个 BUG。

平时切割页面时如果某些按钮有程序功能,我都习惯用以下代码,这样的好处是既容易判断这是一个带程序功能的按钮,同时点击时如果页面过长不会跳转到顶部。

<a href="javascript:;" title="这是一个按钮">这是一个按钮</a>

具体的测试代码如下:

<!doctype html>
<html>
<head>
<meta charset="gb2312">
<title>Gif动画停止测试</title>
</head>
<body>
    <!--用三个 # 号可以避免点击按钮后跳转到网页顶部-->
    <a href="###" onclick="alert('不会停止')" title="不会停止">不会停止</a>
    <a href="javascript:;" title="停止">停止</a>
    <a href="javascript:alert('停止');" title="停止">停止</a>
    <a href="javascript:void(0);" title="停止">停止</a>
    <img src="test.gif" alt="">
</body>
</html>

测试结果是只有第一种写法 Gif 图片才能在所有浏览器下正常播放,下面三种 IE6 下按钮点击时均会造成 Gif动画停止。因此,如果页面中有用到 Gif 图片(例如有验证码的表单),还是使用第一种方式,将要执行的 JavaScript 语句写在 onclick 事件里。

2.IE 无法识别错误格式的图片

遇到这个问题也是很偶然,平时习惯在 PS 中按 Ctrl+Shift+Alt+S 来存储图片,某次由于疏忽将图片选择 Gif 格式点存储后,却又写上了 .jpg 的后缀(以前记得软件会自动补全文件后缀,结果应该会是 imagesname.jpg.gif)。由于那张图是作为背景垂直平铺并且是颜色较浅的渐变图,当时还以为是显示器色差问题,因此查了好久都没发现原因。后面是打开图片文件夹,发现了文件后缀才想起来(一般单色图我都会保存为 gif 降低 K 数)。

img_01

img_02

Chrome 下的效果:

img_chrome

FireFox 下的效果:

img_firefox

Safari 下的效果:

img_safari

IE 下的效果:(测试了 IE 6-9)

img_ie

在这点上 Photoshop 和 IE 一样太过死板,估计都是通过后缀名来选择如何解析图片,对此,我也作了测试。将一张存储为 Gif 的图片复制一份,将后缀名改为 .jpg,并分别用 PS 打开这两张图片。

img_compare

正确格式的打开效果:

img_correct

更改格式后的打开效果:

img_error

posted @ 2013-06-08 14:19  Milly  阅读(591)  评论(0编辑  收藏  举报