レスポンシブではみ出した要素の検出
助かったー
横スクロール はみ出し要素検出
http://netkansai.com/contents/index.php?id=57
function getwidth(){
'use strict';
const bodyElem = document.getElementsByTagName("body");
const bodyWidth = window.getComputedStyle(bodyElem[0],null).getPropertyValue("width");
const numBodyWidth = parseInt(bodyWidth);
console.log("body:",numBodyWidth);
const tags = document.querySelectorAll("*");
for(let i=0; i < tags.length; i++){
let tagMargingLeft = parseInt(window.getComputedStyle(tags[i],null).getPropertyValue("margin-left"));
let tagMarginRight = parseInt(window.getComputedStyle(tags[i],null).getPropertyValue("margin-right"));
let tagPaddingLeft = parseInt(window.getComputedStyle(tags[i],null).getPropertyValue("padding-left"));
let tagPaddingRight = parseInt(window.getComputedStyle(tags[i],null).getPropertyValue("padding-right"));
let tagBorderLeft = parseInt(window.getComputedStyle(tags[i],null).getPropertyValue("border-left"));
let tagBorderRight = parseInt(window.getComputedStyle(tags[i],null).getPropertyValue("border-right"));
let tagWidth = parseInt(window.getComputedStyle(tags[i],null).getPropertyValue("width"));
let tagBoxSizing = window.getComputedStyle(tags[i],null).getPropertyValue("box-sizing");
if(tagBoxSizing === "content-box"){
var sumWidth = tagMargingLeft + tagMarginRight + tagBorderLeft + tagBorderRight + tagPaddingLeft + tagPaddingRight + tagWidth;
}else{
var sumWidth = tagMargingLeft + tagMarginRight + tagWidth;
}
if(numBodyWidth < sumWidth){
console.log(tags[i],":",sumWidth,);
console.log("marginl-left:",tagMargingLeft);
console.log("border-left:",tagBorderLeft);
console.log("padding-left:",tagPaddingLeft);
console.log("width:",tagWidth);
console.log("padding-left:",tagPaddingRight);
console.log("border-left:",tagBorderRight);
console.log("marginl-left:",tagMarginRight);
}
}
}
window.addEventListener("load", getwidth, false);
[/code]