Html 如何在Chrome for OS X中检测滚动条是否占用空间？

我有一些代码假设OSX的垂直滚动条宽度为15px，并相应地进行一些布局

这适用于Mac。然而，在Macbook上，Chrome的滚动条似乎没有占用任何额外的空间。它显示为覆盖在页面内容上。这会导致布局有点扭曲

---

有什么方法可以检测滚动条是否为苹果台式机/笔记本电脑上的Chrome预留了空间？

您可以从

首先，在样式表中定义一些样式指南：

/* way the hell off screen */
.scrollbar-measure {
    width: 100px;
    height: 100px;
    overflow: scroll;
    position: absolute;
    top: -9999px;
}

在javascript中，您可以这样开始：

// Create the measurement node
var scrollDiv = document.createElement("div");
scrollDiv.className = "scrollbar-measure";
document.body.appendChild(scrollDiv);

// Get the scrollbar width
var scrollbarWidth = scrollDiv.offsetWidth - scrollDiv.clientWidth;
console.warn(scrollbarWidth); // Mac:  15

// Delete the DIV 
document.body.removeChild(scrollDiv);

---

也许这能帮你：@Unlockedluca:嗨，谢谢你的回答。这是一个很好的解决方案，我对此进行了研究。但是，我不确定是否允许修改客户端的页面。我正在别人的网站上展示我的iFrame。所以我在寻找一个更具前瞻性的解决方案。@Unlockedluca:我找到了一种使链接的解决方案有效的方法。如果你发帖作为答复，我可能会接受。谢谢。值得注意的是，这不适用于IE（令人震惊）。这张床的重量没有正确归还。我通过在第一个div中添加另一个div（宽度为100%）并减去两个

offsetWidth

swa来解决这个问题，6个月后，我正在搜索解决方案，这就是问题的答案！