javascript - 不同浏览器的 document.body.offsetWidth 变化

Question

document.body.offsetWidth 返回 Firefox 中垂直滚动条左侧到左侧的内部宽度值。 在 IE 中则不然，而是从垂直滚动条的左侧返回到右侧。 有谁知道我可以制作一个可验证的合理方法，例如“var = offsetw;”为了使 offsetw 成为滚动条宽度，我需要减去以获得像 document.body.innerWidth 这样的 firefox 值？ 这是我所拥有的。

if (parseInt(navigator.appVersion)>3) {
    if (navigator.appName=="Netscape") {
        winW = 16;
        winH = 16;
    }
    if (navigator.appName.indexOf("Microsoft")!=-1) {
        winW = 20;
        winH = 20;
    }
    if (navigator.appName.indexOf("Mozilla")!=-1){
        winW = 0;
        winH = 0;
    }
}

Firefox 目前使用 16 值，而不是 Mozilla 行声明的零，这表明它是错误的。

我正在添加或修复后，仅当这些浏览器不自动从 document.body.offsetWidth 中减去滚动条时，才能将 winW 和 winH 调整为每个浏览器的正确滚动条大小

谢谢:)

Answer 1

您尝试过 JavaScript 库吗？这是摆脱这些问题的最简单方法。我推荐:jquery 或 YUI(雅虎用户界面)，其中所有内容都包装在类中，使代码兼容几乎所有浏览器。

除了这个考虑之外，在下面的页面中你可以找到一个函数来了解滚动条的宽度(我没有测试过):

http://www.alexandre-gomes.com/?p=115

http://javascript.jstruebig.de/javascript/70/

代码是这样的(不知道是否兼容所有浏览器):

function scrollbarWidth() {

    // Scrollbalken im Body ausschalten

    document.body.style.overflow = 'hidden';

    var width = document.body.clientWidth;



    // Scrollbalken

    document.body.style.overflow = 'scroll';



    width -= document.body.clientWidth;



    // Der IE im Standardmode

    if(!width) width = document.body.offsetWidth-document.body.clientWidth;



    // urspr?ngliche Einstellungen

    document.body.style.overflow = '';



    return width;

}