工作中遇到的浏览器差别(就不叫IE6bug了)
1、根据ie版本写css
<!--[if lt IE 8]>
<style>
.cntContainer{margin-top: -1px;}
</style>
<![endif]-->
非ie:if !IE; 仅IE:if IE; 等于:if IE 6;
大于:if gt IE 8; 大于或等于:if gte IE 8; 小于或等于: if lte IE 8;
2、关于display:table-row;
比如table中的tr,在js里控制它显示和不显示:document.getElementById('theBlueRow').style.display='table-row'和display:none。IE6不支持table-row,改用display=''。就可以了。
3、获取设置节点的自定义属性:
对于<div id="newTest" myAttr="old"></div>。
获取自定义属性myAttr:
若是document.getElementById("newTest").myAttr,则只对IE6、IE8有效,IE9、IE10、chrome、firefox、safari对无效;
若是document.getElementById("newTest").getAttribute('myAttr')则都有效。
设置自定义属性:
若是document.getElementById("newTest").myAttr = "new";
alert(document.getElementById("newTest").myAttr+","+document.getElementById('newTest').getAttribute('myAttr'));
输出结果:IE9、IE10、firefox、chrome、safari均为:new,old。IE6、IE8则为:new,new。
若是document.getElementById("newTest").setAttribute("myAttr","new");
alert(document.getElementById("newTest").myAttr+","+document.getElementById('newTest').getAttribute('myAttr'));
输出结果:IE9、IE10、firefox、chrome、safari均为:undefined,new。IE6、IE8则为:new,new。
所以为了兼容性,获取和设置自定义属性时统一使用:.getAttribute('myAttr')和.setAttribute("myAttr","new"); 获取jquery的方法.attr();
4、ie6、7里,如果<td></td>则设置td的border无效;
如果是<td> </td>则设置td的border有效.
(在tr上设置border在ie6、7中总是无效的。)
5、IE6里弹出层或是说设置了position:absolute/fixed;的div遮不住select。
解决办法:通过一个与绝对定位的div同样大小的iframe来遮住select。
<div id='fixedDiv>
<div id='fixedDivContent'>div content</div>
<iframe scrolling='no' iframeborder='0' style='position:absolute;left:0;top:0;height:??px;width:100%;z-index:-1'>
</iframe>
</div>
其中的iframe的高度和宽度不能同时是100%。
6、ie6不支持position:fixed;的解决方法:
纯参考完美解决IE6不支持position:fixed的bug
#fixedDiv{ position: fixed;top:;left:;}
/*for ie6*/
*html #fixedDiv{ position:absolute;
left:expression(eval(document.documentElement.scrollLeft+20));
top:expression(eval(document.documentElement.scrollTop+20))}
但是这样在滑动的时候,这个fixeDiv在它该待的地方有很明显的振动,原因是‘
IE有一个多步的渲染进程。当你滚动或调整你的浏览器大小的时候,它将重置所有内容并重画页面,这个时候它就会重新处理css表达式。这会引起一个丑陋的“振动”bug,在此处固定位置的元素需要调整以跟上你的(页面的)滚动,于是就会“跳动”。
解决此问题的技巧就是使用background-attachment:fixed为body或html元素添加一个background-image。这就会强制页面在重画之前先处理CSS。因为是在重画之前处理CSS,它也就会同样在重画之前首先处理你的CSS表达式。这将让你实现完美的平滑的固定位置元素!
’,添加下列代码后就完全看不出振动了:
* html,* html body{
background-image:url(about:blank);
background-attachment:fixed;//不可少,防止画面闪烁
}
不要直接用<html>做测试,记得写<!DOCTYPE......
工作中遇到的浏览器差别(就不叫IE6bug了)的更多相关文章
- 工作中那些提高你效率的神器(第一篇)_Everything
引言 无论是工作还是科研,我们都希望工作既快又好,然而大多数时候却迷失在繁杂的重复劳动中,久久无法摆脱繁杂的事情. 你是不是曾有这样一种想法:如果我有哆啦A梦的口袋,只要拿出神奇道具就可解当下棘手的问 ...
- centos shell编程6一些工作中实践脚本 nagios监控脚本 自定义zabbix脚本 mysql备份脚本 zabbix错误日志 直接送给bc做计算 gzip innobackupex/Xtrabackup 第四十节课
centos shell编程6一些工作中实践脚本 nagios监控脚本 自定义zabbix脚本 mysql备份脚本 zabbix错误日志 直接送给bc做计算 gzip innobacku ...
- Jquery中$与$.fn的差别
当今web开发往往离不开Jquery的使用,Jquery以其简洁的使用方式.良好的浏览器兼容性赢得了软件研发同行的青睐,作为当中的一员,自然也不例外,虽然刚開始时非常排斥Jquery,今天我谈一下对J ...
- css布局 - 工作中常见的两栏布局案例及分析
突然想到要整理这么一篇平时工作中相当常见但是我们又很忽视的布局的多种处理方法.临时就在我经常浏览的网站上抓的相对应的截图.(以后看到其他类型的我再补充) 既然截了图,咱们就直接看人家使用的布局方式,毕 ...
- 浅谈关于QT中Webkit内核浏览器
关于QT中Webkit内核浏览器是本文要介绍的内容,主要是来学习QT中webkit中浏览器的使用.提起WebKit,大家自然而然地想到浏览器.作为浏览器内部的主要构件,WebKit的主要工作是渲染.给 ...
- 转-使用 CefSharp 在 C# App 中嵌入 Chrome 浏览器
使用 CefSharp 在 C# App 中嵌入 Chrome 浏览器 2016-09-23 分类:.NET开发.编程开发.首页精华0人评论 分享到:更多3 本文由码农网 – 小峰原创翻译,转载 ...
- http通信过程中,Web浏览器与Web服务器之间将完成下列7个步骤
http通信过程中,Web浏览器与Web服务器之间将完成下列7个步骤: (1) 建立TCP连接 在HTTP工作开始之前,Web浏览器首先要通过网络与Web服务器建立连接,该连接是通过TCP来完成 ...
- 记录我开发工作中遇到HTTP跨域和OPTION请求的一个坑
我通过这篇文章把今天工作中遇到的HTTP跨域和OPTION请求的一个坑记录下来. 场景是我需要在部署在域名a的Web应用里用JavaScript去消费一个部署在域名b的服务器上的服务.域名b上的服务也 ...
- Java工作中的并发问题处理方法总结
Java工作中常见的并发问题处理方法总结 好像挺久没有写博客了,趁着这段时间比较闲,特来总结一下在业务系统开发过程中遇到的并发问题及解决办法,希望能帮到大家 问题复现 1. "设备Aの奇怪分 ...
随机推荐
- DotNET知识点总结四(笔记整合)
1.枚举:本质是类 如果为第一个枚举赋了一个int值,那么后面的枚举项依次递增 可以将枚举强转成他所代表的int值 C#的枚举项都是常量(可以用Reflector查看literal的IL源码) 因为枚 ...
- favicon支持的图片格式
为网站设置favicon有两种方式: 1.网站根目录下放置名为favicon.ico的图片,浏览器就会自动获取: 2.在页面中通过<link rel="shortcut icon&qu ...
- 解决安装 Visual Studio 2012 后无法连接VPN的问题
1. 单击“开始”,单击“运行”,键入“regedit”,然后单击“确定” 2. 找到下面的注册表子项,然后单击它: HKEY_LOCAL_MACHINE\System\CurrentControlS ...
- MyBatis查询两个字段,返回Map,一个字段作为key,一个字段作为value的实现
1. 问题描述 在使用MyBatis,我们经常会遇到这种情况:SELECT两个字段,需要返回一个Map,其中第一个字段作为key,第二个字段作为value.MyBatis的MapKey虽然很实用,但并 ...
- PHP Simple HTML DOM 使用
下载地址:https://github.com/samacs/simple_html_dom 文档地址 http://simplehtmldom.sourceforge.net/ 一直以来使用php解 ...
- 8.2.1.10 Nested-Loop Join Algorithms 嵌套循环 关联算法:
8.2.1.10 Nested-Loop Join Algorithms 嵌套循环 关联算法: MySQL 执行关联在表之间使用一个嵌套循环算法或者变种 Nested-Loop Join Algori ...
- VS2013单元测试
原文地址:http://www.luacloud.com/2014/vs2013-unit-test-generator.html 下载地址:http://visualstudiogallery.ms ...
- MD中bitmap源代码分析--状态机实例
1. page_attrs的状态转换关系 之前说过,bitmap的优化核心是:bitmap设置后批量写入:bitmap延时清除.写bit用bitmap_statrwrite() + bitmap_un ...
- python+mysql数据库的简单操作
最近接了一个任务,测试某项类似于收益情况报表的功能,因计算公式复杂,单纯手算过于复杂,所以想到写成脚本 根据python的分治原则,先整了几个函数用于实现计算逻辑,后发现数据输入过于繁琐,所以决定使用 ...
- Ubuntu中apt-get出现E:Encountered a section with no Package: header……的解决方案
方法一:运行命令apt-get update更新list列表 方法二:将/var/lib/apt/lists/下的所有list文件都删除,然后再update