鼠标中键的点击的行为默认情况下,通常是创建新的tab并在其中打开指定的链接。浏览器发展到今天,对于鼠标中键点击的事件处理上,仍然没有能够统一,这导致对应于中键的监听变得不可靠,而对于习惯用中键的用户来说,点击某些链接会出现意料之外的结果。 下面对现行浏览器的一般表现做一些总结,浏览器分别为:IE9, FF31,Chrome36以及Opera的Presto内核的末代版本12.17,本文结果均以这些版本为限。 测试代码很简单,由于各浏览器对于鼠标键位的索引值也有些许不同,所以用了jQuery来统一。<a>中的<span>是故意添加的,下文会有说明。 <a href=…
IE的透明滤镜bug算的上是IE为数众多bug里的不起眼的角色,直到之前我确实的遇到了它,我想我根本不会去关注非标准的IE滤镜带来的各种问题。这个bug的表现非常的直观,filter透明度渐变后,图片的某些点变成了透明的了!比如如果这个时候背景是白的,就是白色的噪点。这在banner切换时表现的非常明显——渐变是产生噪点,渐变完成后噪点也会一直残留: 这个Bug在IE6 7 8里都存在,实际上只要使用了透明滤镜就会表现出来,并且非常有趣的是,它只对一种颜色值有反应:#02050a 为什么是这个颜色?恐怕只有微软才知道。一开始我只是以为只有一些偏黑色的图片会出现这样的情况,但后来经过一系列测试我才发现原来出现的噪点如此固定以至于所有噪点所在的像素点原来的色值都是#02050a,决然不是巧合。然后,如果google这个"#02050a",就能找到关于它的各种文章了,…
有些问题可能很少有机会遇到,前段时间我就在工作中遇到一个由word-wrap引起的兼容问题。因为当 word-wrap:break-word 这种 rule被加到了全局CSS里后,出现问题就显得非常隐蔽,所以排查了不少时间才找到原因。不过这也不算大问题,因为造成这种情况是多种因素的巧合。如下图: 造成这种莫名其妙间隙的原因就是对li应用了word-wrap的结果。但是单单应用word-wrap还不足以使IE6和IE7出现反常,另一个必要条件就是没有对li指定宽度。如果每个单元都是由图像的高宽撑大的而没有设置宽度,这样再加上word-wrap就出现了上面那张图中的情况。 既然反复测试中知道了原因那么解决方法也就显而易见了。解决方法有3个: 对li应用word-wrap:normal; 限定li元素的高宽; 对图片的万精油display:block; 随后闲话说说word-wrap,一个微软的私有属性,但现在也已经被CSS3标准吸纳。虽然这是一个非常实用的属性,但是在某些特定情况下,对旧浏览器仍然还是会造成一些影响的。…