浮动层没有内容在IE下失效bug

eta http-equiv=Content-Type content=textml; charset=utf-8 /title浮动层没有内容在IE下失效bug/titlestyle type=text/css.left,.right{position:absolute;height:100%;width:50px;top:0px;}.left{left:0px;}.right{right:0px;}/style/headbody  问题描述:在IE浏览器下,浮动层如果没有内容或者未设置过背景之类,当这个层浮动在正常内容的上面时,添加到浮动层上面的事件,如 click,mouseover等事
http://www.w3dev.cn/article/20120606/float-layer-content-blank-IE-event-bug.aspx

关于IE的layOut bug

  在开发中我们常会在ie中遇到很多莫名的bug,尤其是ie6这个早就该退出历史的浏览器。刚刚在haslayout.net上看到有总结ie的一些 bug,分享一下。1.图片label bug,影响版本ie6/ie7/ie8,当label中有img的时候无法触发点击选中form元素事件.demo http://haslayout.net/demos/Image-Label-Focus-Bug-Demo.htmlfix demo http://haslayout.net/demos/Image-Label-Focus-Bug-Fixed-Demo-CMS.html解决方案:通过给label内加入一
http://www.w3dev.cn/article/20100702/2662.aspx

9个最常见IEBug及其fix

Internet Explorer – Web程序员的毒药。在IE上开发时间中有超过60%的时间是花在和IEbug进行搏斗,让你的开发生产率严重下降。下面是一个教程,告诉你9个IE上最常见的BUG以及如何解决它们。1. 居中布局创建一个CSS定义把一个元素放到中间的位置,可能是每一个Web开发人员都会做的事情。最简单的做法是为你的元素增加一个margin: auto; ,然而 IE 6.0 会出现很多奇怪的行为。让我们来看一个例子。01#container{ 02border: solid 1px #000; 03background: #777; 04width: 400px; 05hei
http://www.w3dev.cn/article/20091222/1211.aspx

IE子元素float left碰到父容器边界子元素居右bug

  IE下一个简单的css菜单,父元素li float布局,position relative,子菜单ul position absolute定位定宽,然后子菜单li元素也是float定位,定宽,为父元素宽度1/2,设置line-height,并排显示2个,但是发现在ie8+下,有个子菜单的li居然居右,firefox,chrome,ie7(IE就是怪咖啊,ie7尽然正常,ie8+不正常)下显示正常。  结构大概如下IE8+显示效果,紧跟HTML那个li尽然右浮动了chrome,firefox,ie7显示效果lia href=#首页/aem/emullia href=#jqGrid/a/lil
http://www.w3dev.cn/article/20151119/IE-child-float-left-parent-last-child-float-right.aspx

CSS1Compat模式下IE8+ onpropertychange bug

  CSS1Compat模式下IE,给输入控件注册了onpropertychange事件后,如果在事件中修改了控件的值,IE下会再次触发onpropertychange事件,但是此时输入内容,不会响应onpropertychange事件了,再输入一个字符才会响应,如此重复。firefox下对应的oninput事件,对javascript动态设置控件内容不会响应oninput事件,IE则会响应onpropertychange事件。!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xht
http://www.w3dev.cn/article/20130805/CSS1Compat-IE8-onpropertychange-bug.aspx

firefox下javascript设置marquee innerHTML滚动bug

mouseout=this.start() scrollamount=3 direction=left behavior=scroll loop=-1 deplay=0解决办法就是给marquee添加一个容器,如上面所示,设置div容器的innerHTML,连marquee标签一起设置就没问题了/marquee'; }, 2000);//随便设置计时器延时时间,firefox下也正常工作 }/script  此问题只在firefox下出现,ie和chrome在文档流关闭后设置marquee innerHTML内容长度大于marquee定义宽度也会继续滚动剩余的内容。
http://www.w3dev.cn/article/20130726/firefox-javascript-set-marquee-innerHTML-bug.aspx

document.createElement创建iframe在IE兼容模式无法指定target问题

  使用document.createElement创建的iframe对象,在IE兼容模式(包括ie10),IE7-浏览器下运行时,无法在DOM对象中生成name属性(但是却可以获取到name属性为设置的内容,IE真是个大bug),而是变成了一个自定义属性submitName。所以链接对象,表单如果通过target指向这个iframe,那么会在新窗口打开,而不是在document.createElement创建的iframe中打开,就好像iframe没有在window窗口中注册过一样,  示例代码如下 script window.onload = function () {
http://www.w3dev.cn/article/20130708/document.createElement-iframe-ie-Compatible-mode-submitName.aspx

解决ie下移动浮动层闪动问题

  IE浏览器下如果使用setInterval/setTimeout计时器实现实时移动浮动层时,浮动层会有一些细微的闪动或者震动,因为IE有一个多步的渲染进程,当滚动或调整浏览器大小的时候,它将重置所有内容并重画页面,这个时候它就会重新处理css表达式。这会引起一个丑陋的闪动/振动bug,在此处固定位置的元素需要调整以跟上(页面的)滚动,就会出现跳动。  IE7+浏览器可以通过增加xhtml申明,将文档模式修改为CSS1Compat支持position fixed定位,这样就不会闪动了。  如果是IE-或者未添加xhtml申明,解决此问题的技巧就是使用background-attachmen
http://www.w3dev.cn/article/20130507/fix-ie-float-div-move-flashing.aspx

IE浏览器内存释放注释事项

  在IE下的JS编程中,以下的编程方式都会造成即使关闭IE也无法释放内存的问题,下面分类给出:1、给DOM对象添加的属性是一个对象的引用。范例:var MyObject = {};document.getElementById('myDiv').myProp = MyObject;解决方法:在window.onunload事件中写上:document.getElementById('myDiv').myProp = null;2、DOM对象与JS对象相互引用。范例:function Encapsulator(element) { this.elementR
http://www.w3dev.cn/article/20130130/IE-Memory-leak-notes.aspx

如何解决IE内存泄漏

y need closure semantics. In most cases, non-nested functions are the right way to go. 是非常消极的应付之辞。今天关于IE内存泄漏的文章已有很多,而且很大部分就是微软的自己人在解释,甚至象Eric Lippert这样引擎开发组的成员。但是他们的文章始终没有正面承认其实这就是IEbug,而且是非常严重的bug,这事情其实完全不关脚本引擎对象 和DOM对象的事。就是微软对产品不负责任的表现,不说IE4,1997那个春天那是太遥远了点,但是IE6也是2001年随xp发布的。使用COM可以 给他们的开发带来很多便利
http://www.w3dev.cn/article/20130130/IE-Memory-leak-solution.aspx

ie margin top失效当前一个节点display为absolute

  在IE浏览器下面,某个节点设置了margin-top和height属性时,如果此节点的上一个兄弟节点的display为absolute,这个节点的margin-top会失效。去掉这个节点的height属性后,margin-top又起作用了。  解决办法1)将绝对定位的节点放到所有兄弟节点的最后,这样在display为absolute前面设置过height的兄弟节点的margin-top就不会失效了。2)给display为absolute的节点再添加一个父节点,不设置样式即可3)去掉节点的height属性,不推荐。不设置height就不出现这个bug了,呵呵。。  测试代码如下,用IE8-浏
http://www.w3dev.cn/article/20121014/ie-margin-top-previous-node-display-absolute-bug.aspx

2个并排input在XHTML摸下下IE下输入中文导致offset增加bug

  在IE浏览器下面,当文档申明为xhtml时,2个并排的在一起的输入控件,当一个输入框内容为非中文内容,另外一个为中文时,出现奇怪的问题。测试代码在最后1)IE8浏览器下面顶部会出现2px差距,没有对齐,并且输入框内的文字没有对齐,中文接近顶部,非中文内容和中文内容相差2px左右,如图一。图一2)IE7浏览器下面顶部对齐,但是输入框内的文字没有对齐,中文接近顶部,非中文内容和中文内容相差2px左右,和IE8一样,如图二。图二  通过IE开发者工具查看布局发现,在IE8浏览器下面,中文输入内容input的offset会多2px,如图三,图四。通过图片可以看出中文input的offset莫名奇妙
http://www.w3dev.cn/article/20121010/input-abreast-IE-top-not-alignment.aspx

IE对CSS样式表的限制和解决方案

连接数。  2. 没有解决@import指令31次限制的问题,其实可以提取其href值然后进行激活处理。但是实际应用在建议用link标记来替代@import指令,因为在IE中@import指令相当与把link标记写在文档的底部,会导致在IE5/6页面加载时瞬间无样式问题,学名叫“Flash of Unstyled Content”(简称为FOUC)的bug,当然可以通过在文档头中放一个link或script元素可以避免这个bug。  3. 一般来讲页面之所有出现大量的link或者style标签很可能有很多是相同的,可以在aCssText合并前除掉相同的项,减少代码量。  如果不用DOM中已存在
http://www.w3dev.cn/article/20111213/solution-of-limit-style-tags-in-ie.aspx

div+css兼容IE和firefox等浏览器方法

应在IE下无效,这时候应该触发IE的layout私有属性(万恶的IE啊!)用zoom:1;可以做到,这样就达到了兼容。 例如某一个wrapper如下定义: .colwrapper{ overflow:hidden; zoom:1; margin:5px auto;} 2、margin加倍的问题。 设置为float的div在ie下设置的margin会加倍。这是一个ie6都存在的bug。 解决方案是在这个div里面加上display:inline; 例如:#div id="imfloat"/#div 相应的css为 #IamFloat{ float:left; margin:5px;/*IE下理
http://www.w3dev.cn/article/20111130/div-css-ie-firefox-compatible.aspx

firefox下button内嵌span会出现移位bug

如果button内部嵌入span,button和span的display都为block,width,height都一致时,span无法完全遮盖住button控件,button和span会出现一些边距,在Firefox3.6下面,左边相差3px,顶部相差 2px,不知道是不是Firefox的bug。  在IE浏览器和chrome浏览器下不会出现这种问题。测试代码如下+展开-HTMLstyletype="text/css".jsbutton{display:block;width:200px;height:40px;border:0px;background:#aaa;padding:0px;}
http://www.w3dev.cn/article/20110720/firefox-button-Embed-span-margin.aspx

IE浏览器图片存在热点和链接时链接失效

IE浏览器下,如果图片加了链接,并且同时需要给图片加热点的时候,链接会失效,无法点击,⊙﹏⊙b汗测试代码如下+展开-HTMLahref="//"imgsrc="//logo.jpg"border="0"usemap="#Map"/mapname="Map"id="Map"areashape="rect"coords="5,18,85,29"href="mailto:shaobo@chinabn.org"//map/aIE的bug还真多。没办法,只好用事件来解决这问题了,修改好的代码如下+展开-HTMLahref="//"onclick="if(document.all&&event.srcE
http://www.w3dev.cn/article/20101222/IE-image-exist-hot-spot-and-link-cause-link-failure.aspx

IE6下的119个bug

ble This bug has been reported at connect's IE beta feedback as bug 339307. This bug has been closed by the IE team and will not be fixed for the release of IE 8 final.27- Incorrect parsing of CSS declarations involving cursor: url("...")28- Percentage on padding is not rendered Fixed in IE 7 beta 2
http://www.w3dev.cn/article/20100702/2663.aspx

IE8下的60个bug

t go to Ingo Turski for discovering and reporting this bug at IE blog on March 6th 2008 and to Dean Edwards for discovering and reporting this bug at IE blog on September 15th 2005. This bug has been reported at connect's IE beta feedback as bug 354956.23- objOption.defaultSelected = true is not sup
http://www.w3dev.cn/article/20100702/2665.aspx

Opera10下的31个bug

ellpadding. This is a regression bug since Opera 6.06 had it correct, right. See bug 285490 in Opera BTS.2- When hovering over a text node within an element, event.offsetX and event.offsetY are always wrong. Also: complete event.offsetX/Y demo. See bug 123302 and bug 155834 in Opera BTS3- event.offs
http://www.w3dev.cn/article/20100702/2666.aspx

KindEditor IE11下粘贴到最后bug解决办法

3870829  kindeditor-min.js修改部分如下,记事本打开后搜索__kindeditor_paste__定位到粘贴的代码,增加如下红色圈出的2处代码  kindeditor-min.js是压缩过的,所以不同版本变量不一样,同一个版本也可能不一样。1)第一处增加||Yb(),判断走IE分支。定位这个if可以搜索完__kindeditor_paste__,在搜索body).append(,注意不能加变量,版本和你所使用版本不一样搜索不出来,然后在if中添加那个判断分支即可。2)添加第二处的代码,在操作完第一步后搜索selectNodeContents定位到要加代码的前面,注意是在
http://www.w3dev.cn/article/20170522/fix-KindEditor-IE11-paste-at-last-bug.aspx

更正easyui datebox年月面板年份输入框bug

box点击年月面板第一行的月份切换按钮,如果换年后(往前或者往后都一样),年份输入框的年份值不会更改。如下图所示准备换年切换到2018年,但是年份输入框还是2017年  解决这2个bug源代码如下,1.3.3及1.4.5的easyui版本测试通过,其他版本自己检查对应的选择器!DOCTYPE htmlhtmlheadmeta charset=UTF-8title更正easyui datebox年月面板年份输入框bug/titlelink rel=stylesheet type=text/css href=../../themes/default/easyui.csslink rel=style
http://www.w3dev.cn/article/20170104/fix-easyui-datebox-year-month-panel-input-bug.aspx

JavaScript Keyboard Events

de.keydown and keyup eventsevent.keyCodeevent.whichevent.charCodeIE9.0(Windows)IE keycodeundefinedundefinedInternet Explorer(Mac)IE keycodeundefinedextended ASCII codeIE9.0WebKit 525IE keycodeIE keycodezeroWebKit 525IE keycodeIE keycodeASCII code if ASCII character,zero otherwiseGeckoMozilla keyc
http://www.w3dev.cn/article/20160114/JavaScript-Keyboard-Events.aspx

CSS表格固定表头示例

0px;top: 0;left: 0;}#wrap {position: relative;padding-top: 30px;}/style!--小于IE8增加css expression结合上面的修正css才有用,用js的onscroll事件来设置top属性还是会闪动。--!--[if lt IE 8]scriptvar ie7min=true/scriptstyle#th{position:absolute;top:expression(eval(document.documentElement.scrollTop));}/style![endif]--script type=text/
http://www.w3dev.cn/article/20151210/css-fixed-table-head.aspx

IE透明滤镜alpha失效解决办法

rsor的候选资源,用逗号隔开,ie需要使用.cur文件*//stylediv id=dvTablediv class=opc4table border=1trtd表格一/td/tr/table/divdiv class=opc4table border=1trtd表格二/td/tr/table/divdiv class=opc4table border=1trtd表格三/td/tr/table/divdiv class=opc4table border=1trtd表格四/td/tr/table/div/div解决办法就是添加ie独有zoom:1样式即可解决IE透明滤镜alpha失效问题。!D
http://www.w3dev.cn/article/20150421/ie-filter-alpha-invalid.aspx

让IE6,IE7支持display inline-block

1等)。代码如下:div {display:inline; zoom:1;...}  IE6,IE7设置display inline-block源代码!DOCTYPE htmlstylediv{display:inline-block;width:100px}/style!--IE6,IE7 css hack,使用IE独有的条件注释--!--[if lte IE 7]stylediv{display:inline}/style![endif]--divdiv inline-block 1/divdivdiv inline-block 2/divdivdiv inline-block 3/div
http://www.w3dev.cn/article/20150319/IE6-IE7-css-hack-support-inline-block.aspx

RequireJS2.0中文API

dules错,可能意味着依赖于requireModules数组中的模块的其他模块未定义。 4.6.1在IE中捕获加载错 Internet Explorer有一系列问题导致检测errbacks/paths fallbacks中的加载错 比较困难:IE 6-8中的script.onerror无效。没有办法判断是否加载一个脚本会导致404错;更甚地,在404中依然会触发state为complete的onreadystatechange事件。IE 9+中script.onerror有效,但有一个bug:在执行脚本之后它并不触发script.onload事件句柄。因此它无法支持匿名AMD模块 的标准方法
http://www.w3dev.cn/article/20141201/RequireJS2.0-chinese-API.aspx

去掉IE特有css样式expression

  IE浏览器下有一个特殊的样式expression,可以动态执行js脚本,this对象指向启用了expression样式的对象。expression这个样式比较耗资源,只要鼠标或者键盘有动作,就会执行这个事件。  要移除IE的expression css样式,需要使用IE style属性特有方法removeExpression,不能通过style.xxx=null移除。  去掉IE特有css样式expression源代码如下title去掉IE特有css样式expression/titlestyle.expression{innerHTML:expression(this.innerHTML=
http://www.w3dev.cn/article/20141121/remove-ie-css-expression.aspx

数字在主键盘和小数字键盘下的keyCode值不一致

样(主要在W3C浏览器和IE浏览器下,下面说的代表IE8-,IE9+没测试)  在IE下onkeypress事件不能对系统功能键(例如:后退、删除等)进行正常的响应,W3C浏览器不存在这个问题,可以响应keypress事件。对中文输入法输入时,IE和w3c浏览器都无法响应onkeypress事件。但是IE下onkeydown和onkeyup能及时响应事件,w3c浏览器只响应第一个字符按下事件(onkeydown)和最后一个输入结束事件(一般是空格onkeyup)。    获取keyCode值时,又可以区分为数字和字母。1)对于字母,主要区别在firefox。  在IE下,onkeypress
http://www.w3dev.cn/article/20141106/number-key-keycode-different-from-main-small-number-keyboard.aspx

ie execCommand saveas为txt文件会在某个长度后换行

  今天在csdn看到一个问题,在IE下exeCommand 调用saveas命令,将某些内容存为txt文件时,当一行的长度大于某个长度时,会自动换行,而实际保存的内容是没有换行的。  示例代码如下script type=text/javascript function fnsave() { var tab = document.getElementById(a); var contents = tab.innerHTML; var winname = window.open('', '_blank', '
http://www.w3dev.cn/article/20141023/ie-execCommand-saveas-txt-line-wrap-in-some-length.aspx

IE创建iframe设置frameborder为0

put,maxlength属性就 应写成setAttribute(maxLength,50)而非maxlength。另外比较特殊的是设置class属性,dom中我们用 HTMLElement的className属性,在这里按上面说的应写成setAttribut(className,'c)在IE下正确,但 FF下并不行,FF认识class。兼容性写法element.setAttribute(class, value); //for firefoxelement.setAttribute(className, value); //for IEvValue必填项. 为属性指定的变量,可以为s
http://www.w3dev.cn/article/20140617/IE-create-iframe-set-frameborder-0.aspx