I.K.8.K 爱看不看 » webdev

著名的IE6 double margin bug

hustcom — Tue, 16 Dec 2008 00:49:42 +0000

同样在IE5和IE5.5上也能重现的bug，就是到一个元素float方向和margin方向相同的时候，margin会加倍。

比如一下元素：

它的样式：

.left

{

float: left;

margin-left: 10px;

}

在IE6下，你会发现这个margin其实占据了20px。

原因就是这是浏览器的bug，解决方案也很多，我这里举几条：

加”display:inline”的style: 在元素float后，display属性随之无效，所以你可以大胆地加上这个属性；
绕道行之：换用padding，或调换父级子级间距关系等方式避免正面遇到这个bug；
CSS hack：不推荐，不告知。

麻烦的名叫MSNMessenger.Hotmail2Control的ActiveX对象

hustcom — Fri, 21 Nov 2008 08:35:09 +0000

www.msn.com上的navigation里有一个Messenger的小link，如果你已登录了MSN Messenger，当你在IE下点击这个link的时候，你的MSN Messenger便会激活并置于页面前端，很无聊的一个功能吧。
具体实现起来也很简单，安装MSN Messenger的时候，你的注册表就被动了手脚，所以可以用很简单的JS就可以实现调用，具体JavaScript代码如下：
var messengerObj = new ActiveXObject(“MSNMessenger.Hotmail2Control”);
messengerObj.ShowContactList();

但是，事情往往没有那么简单。你在www.msn.com的页面上可以通过fiddler改它的HTML,让其他link也有同样的JS调用，而且功能可以正常实现，但在其他页面上，就实现不了这个功能了。

为什么？准确的答案不知道，但可以肯定的是，domain server被做了手脚，非msn的网站想实现这个功能，没门。。。

未完待续。。。

如何生成半透明层

hustcom — Wed, 19 Nov 2008 02:51:54 +0000

如同下图：

这里其实包含3层：底部slideshow，中部半透明的黑色mask层，上面的logo和按钮层。

这里谈到的就是如何实现中部的黑色mask层。

有人说到用图片，ok，GIF是不支持半透明的，PNG在IE6以及其以下版本的IE上不能使用透明效果。所以用图片是难以较好实现的。

所以还是得借助CSS里的滤镜。

这时，有人会提到直接写到CSS文件里，这样的问题是该CSS文件不能通过W3C认证。

因此只有一个办法，用JS去加载inline的CSS，具体代码如下：

tmp.style.opacity = 0.5;
tmp.style.filter = “alpha(opacity=50)”;

这样的效果是兼容各主流浏览器的，包括IE5这样的老不死浏览器。