查找并修复页面意外的overflow

[广告]京东京造 K2蓝牙双模机械键盘 背光84键有线/蓝牙无线双模


响应式网站设计切换不同尺寸后偶尔会出现页面内容比屏幕要宽面导致出现横向滚动条。这里有个脚本可以方便的检测哪个元素超出了屏幕:

var docWidth = document.documentElement.offsetWidth;

[].forEach.call(
  document.querySelectorAll('*'),
  function(el) {
    if (el.offsetWidth > docWidth) {
      console.log(el);
    }
  }
);

找到元素后,修改适配即可。

参考资料

Smashing Magazine — For Web Designers And Developers

码中人 微信公众号

关注微信公众号

码中人 微信公众号