ie11的兼容bug----总览

最新推荐文章于 2022-01-12 20:57:24 发布

置顶 sol999

最新推荐文章于 2022-01-12 20:57:24 发布

阅读量294

点赞数 1

分类专栏： css3 JavaScript ie兼容文章标签： css

本文链接：https://blog.csdn.net/weixin_40024174/article/details/107670774

版权

JavaScript 同时被 3 个专栏收录

22 篇文章 1 订阅

订阅专栏

css3

18 篇文章 0 订阅

订阅专栏

ie兼容

3 篇文章 0 订阅

订阅专栏

ie浏览器跟各个浏览器兼容：（貌似没多大用，但有时也有用的）
头部添加：

   <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>

css兼容处理：

1.select下拉标签隐藏小箭头

select::-ms-expand { display: none; }//清除ie的默认选择框样式清除，隐藏下拉箭头
select {
    padding-right: 36px;
    background: url(../images/select-down.png) right center no-repeat;
    background-size: 38px;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;//将默认的select选择框样式清除
}

2.inline-block在ie兼容性问题
inline-block是CSS2.1属性，而大家经常会这么处理ie6、7下的

inline-block

.selector {
display: inline-block;
*display: inline;
*zoom: 1;
}

js兼容处理：

1.页面滚动时获取滚动高度
可以参照 http://www.huangwenchao.com.cn/2014/12/prevent-window-scrolly.html

//window.scrollY 在ie11不生效
//document.documentElement.scrollTop 在ie11生效
var scroll_y = window.scrollY ? window.scrollY :document.documentElement.scrollTop;

//document.documentElement.scrollLeft // 替代 window.scrollX

2.设置页面滚动的高度：
参考https://blog.csdn.net/weixin_40024174/article/details/109495192
滚动用scrollingElement：

document.scrollingElement.scrollTop = moveTop;//所有
$('body,html,document').stop().animate({
          scrollTop: moveTop
  });//所有
document.documentElement.scrollTop; //pc端
document.body.scrollTop;//移动端

window.pageYOffset  //获取窗体的滚动高度（ie9+),pc/移动都支持