浏览器兼容性问题总结

浏览器兼容性问题总结

如下兼容性问题总结只支持到IE8及以上，更低版本不通过测试

1. 元素透明度的问题

在chrome ,ff等浏览器中，只须要设置opacity便可达到的效果，在IE中须要对多个要素进行设置才行

 

{

filter:alpha(opacity=70);
-moz-opacity:0.7;
-khtml-opacity: 0.7;
opacity: 0.7;

}

2. js引入的问题 text/javascript和application/javascript  在页面引入js代码的时候，须要写出type的类型。

　 虽然application/javascript是标准的type类型，可是你们都喜欢写成text/javascript 因此浏览器对它的支持更好(特别是IE) ，

    因此若是你使用类型是application/javascript ，在低版本的IE中，代码有可能会不执行，这点须要注意。

3. css3 中的border-radius 属性，在IE8中支持的并非很好，人多人都介绍了如何处理这种兼容问题，可是用过以后会发现仍是

　会有不少其余问题的出现，因此建议：若是须要兼容IE8如下的版本，仍是用切好的圆角图片更为合适。

4. firefox浏览器的鼠标滚动事件，因为firefox并不支持onmousewheel事件，因此须要进行浏览器判断为其绑定DOMMouseScroll事件

　　if(document.addEventListener){ 
　　　　document.addEventListener('DOMMouseScroll',scrollFunc,false); 
　　}

　用jquery绑定mousewheel事件的时候，能够绑定mousewheel事件，在执行的时候打印出ev的值，在向上或向下滚动的时候发现只有deltaY的值会变化，或1或-1，由此可判断滚轮滚动的方向。

　$(document).on('mousewheel', function(ev) {});

5. 微信中使用<input type="file"> 的问题。

有时候咱们会在微信公众号里开发会遇到上传图片的功能，当你写<input type="file"> 的时候，在IOS上能够成功调起拍照和图库两块，在安卓手机上只能调取图库而没有拍照功能，解决办法：给input 加上accept属性

<input type="file" accept="image/*" />  //调用相机 ，图片或者相册 （二者都行）

加上了capture=camera"属性以后安卓手机就直接调用了相机，没有了图库的选项

<input type="file" accept="image/*;capture=camera"> //直接调用相机

<input type="file" accept="video/*;capture=camcorder"> // 调取视频
<input type="file" accept="audio/*;capture=microphone"> //调取音频

注：capture表示，能够捕获到系统默认的设备，好比：camera--照相机；camcorder--摄像机；microphone--录音。————————————————版权声明：本文为CSDN博主「yx_cos」的原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处连接及本声明。原文连接：https://blog.csdn.net/yx_cos/article/details/82629719