- 爱易网页
 
                        - 
                            HTML教程
 
                        - js跟css兼容IE和FF 
 
                         
                    
                    
                    日期:2014-05-17  浏览次数:20844 次 
                    
                        
                         js和css兼容IE和FF
    1. js和css兼容IE和FireFox(FF)  
   2. css:  
   3. 1.  
   4. ul标签中FF中有个padding值,却没有margin值,而在IE中正好相反  
   5. 解决办法:将ul的padding和margin都设为0(也可以不是0)如:padding:0;margin:0;list-style:none;  
   6. 另外form默认在IE中也会有margin值,所以最好也将其margin和padding设为0  
   7.   
   8. 2.  
   9. ie中cursor:hand可以将鼠标设为手形,FF不行,  
  10. 解决:都用cursor:pointer  
  11.   
  12. 3、居中问题  
  13. ie需要将父窗口:text-align:center;而ff则是margin-left:auto;margin-right:auto;  
  14.   
  15. 4.IE和FF盒模型有区别,所以有需要特殊设置  
  16. IE Box的总宽度是: width+padding+border+margin宽度总和  
  17. FF Box的总宽度就是 width的宽度,padding+border+margin的宽度在含在width内。  
  18. FF: 支持 !important(优先解析), IE 则忽略, 可用 !important 为 FF 特别设置样式  
  19. width:600px !important;//这个要放在前面才行  
  20. width:598px;  
  21. 另外:传说IE7会奇怪的支持!important,试过却不行;  
  22.   
  23. 5.  
  24. IE6中在设置float的div中margin会加倍,解决办法:div里面加上display:inline;  
  25.   
  26. 6.透明滤镜:  
  27. IE:filter:progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=30);  
  28. FF:opacity:0.3;  
  29. 或者:  
  30. IE:filter:alpha(opacity=60);   
  31. FF:-moz-opacity:0.6;/*已过时,用上面的opacity代替*/  
  32.   
  33. 7.禁用选择  
  34. IE:使用js,onselectstart="return false;";  
  35. FF:使用CSS,-moz-user-select:none;  
  36.   
  37. 8:圆角:  
  38. FF中:-moz-border-radius:4px;  
  39.   
  40. js:  
  41. 1.  
  42. IE中innerText在FF中没有,使用textContent;  
  43. eg:  
  44. var obj=document.getElementById("_td");  
  45. var text;  
  46. if(obj.innerText) {  
  47.     text=obj.innerText;  
  48. } else if(obj.textContent) {  
  49.     text=obj.textContent;  
  50. }  
  51. (DHTML手册说innerText不能用在tr,td等节点上,不过我之前明明用过的,然后昨天在测试别人的页面时用上面的方法IE取不到值,有哪位知道的希望告知下,在什么情况下不能使用innerText)  
  52. 2.  
  53. 在Ajax中返回对象状态IE可以使用readystate但是在FF中必须为readyState,所以最好是都写成readyState  
  54.   
  55. 3.获取IE和FF中的键盘返回值,<input type="text" onkeyUp="test(event)"/>  
  56.     function test(e) {  
  57.         var keyc=GetKeyCode(e);  
  58.         alert(keyc);  
  59.     }  
  60.     function GetKeyCode(e) {//取得不同浏览器下的键盘事件值  
  61.         var keyc;  
  62.         if(window.event) {//ie键盘事件  
  63.             keyc=e.keyCode;  
  64.         } else if (e.which) {//火狐  
  65.             keyc=e.which;  
  66.         }  
  67.         return keyc;  
  68.     }  
  69.       
  70. 4.为对象添加移除事件  
  71. var 
                        
                     
                    
                    
                        免责声明: 本文仅代表作者个人观点,与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。