兼容问题

css兼容：
1.box-shadow：
filter:progid:DXImageTransform.Microsoft.Shadow(color=#909090,direction=120,strength=4);/兼容ie/
-moz-box-shadow: 2px 2px 10px #909090;/兼容firefox/
-webkit-box-shadow: 2px 2px 10px #909090;/兼容safari或chrome/
box-shadow:2px 2px 10px #909090;/兼容opera或ie9/
2.transition
.element {
background-color: red;
-webkit-transition: background-color linear .8s;
-moz-transition: background-color linear .8s;
-o-transition: background-color linear .8s;
transition: background-color linear .8s;
}
.element:hover {
background-color: blue;
}
3.border-radius:
.element {
-webkit-border-radius: 10px 11px 12px 13px;
-moz-border-radius: 10px 11px 12px 13px;
border-radius: 10px 11px 12px 13px;
}

4.渐变

.demo {
background: -webkit-gradient(linear, 0 0, 0 100%, from(#80c1e7), to(#213c7c));
background: -webkit-linear-gradient(left, #80c1e7, #213c7c);
background: -moz-linear-gradient(left, #80c1e7, #213c7c);
background: -o-linear-gradient(left, #80c1e7, #213c7c);
background: -ms-linear-gradient(left, #80c1e7, #213c7c);
filter: progid:DXImageTransform.Microsoft.gradient(GradientType = 1, startColorstr = #80c1e7, endColorstr = #213c7c);
}
5.opacity
filter:alpha(opacity=50);
-moz-opacity:0.5;
-khtml-opacity: 0.5;

inline-block: >=ie8
min-width/min-height: >=ie7
:before,:after: >=ie8
div:hover: >=ie7
inline-block: >=ie8
background-size: >=ie9
圆角: >= ie9
阴影: >= ie9
动画/渐变: >= ie10

JS兼容：
1.关于获取行外样式 currentStyle 和 getComputedStyle 出现的兼容性问题
2.关于使用 event对象，出现的兼容性问题
var oEvent==ev||event;
3.关于获取滚动条距离而出现的问题
var scrollTop=document.documentElement.scrollTop||document.body.scrollTop
4、阻止事件冒泡：
event.stopPropagation();
event.cancelBubble = true;
5、阻止默认事件：
event.preventDefault();
event.returnValue = false;
6、获取可视区域兼容：
3) 网页可视区域兼容
window.innerHeight || document.documentElement.clientHeight
window.innerWidth || document.documentElement.clientWidth
7）事件目标对象兼容
var t = event.target || event.srcElement;