常见兼容 IE、 FF、 Google Chrome
官网地址：http://www.bjtces.com
导读：在学习或者使用javascript的过程中，最为痛苦的就是浏览器兼容问题
1、Event对象
window.event (IE) ev(标准浏览器)
解决办法例子：
document.onclick = function(ev){
var ev = ev|| window.event;
alert(ev);
}
2、JavaScript原生获取滚动距离
document.documentElement.scrollTop(标准浏览器)
document.body.scrollTop (Google Chrome)
解决办法
var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
3、FF浏览器下有空DIV的时候出现bug
解决办法：在拖拽的方法里面加上以下代码
return false;//阻止默认事件
4、 滚轮事件：
onmousewheel (IE、Google) DOMMouseScroll(FF) wheelDelta 滚轮属性(IE、Google) detail滚轮属性(FF)
阻止默认事件：绑定写法：preventDefault
window.onload = function() {
var item = document.getElementById('example');
if (item.addEventListener) {
item.addEventListener('DOMMouseScroll', fn, false); //FF三个参数
}
item.onmousewheel = fn;
function fn(ev) {
var ev = ev || event;//event 事件兼容处理
var flag = false;
if (ev.wheelDelta) {
flag = ev.wheelDelta < 0 ? false : true;
}else{
flag = ev.detail > 0 ? false : true;
}
if (flag) {
item.style.height = item.offsetHeight - 10 + 'px';
}else {
item.style.height = item.offsetHeight + 10 + 'px';
}
//阻止绑定事件
if (ev.preventDefault) {
ev.preventDefault();
}else{
//阻止普通事件
return false;
}
}
}
5、监听事件兼容性问题
在 IE6 和FF 浏览器出现 IE6 特殊对待：对象.attachEvent(事件名, 函数) IE6 解绑：对象.detachEvent(事件名, 函数) FF以及标准浏览器：对象.addEventListener(事件名,函数,是否捕获 true || false) IE下绑定事件this指向window
HTML5 CSS3 JavaScript
网友评论