Question

我在Chrome中遇到vieport问题。 Chrome中的文档宽度为1309px，Firefox中为1440px。我阅读了很多参考资料，但我不明白问题出在哪里。

我的html标题：

<!DOCTYPE html>
<html class="js" lang="en" dir="ltr">
<head profile="http://www.w3.org/1999/xhtml/vocab">
<meta charset="utf-8">
<link type="image/png" href="favicon.png" rel="shortcut icon">
<title>Page title</title>
<meta content="width=device-width" name="viewport">
<meta content="on" http-equiv="cleartype">
(...)

我看了：

https://stackoverflow.com/a/9027284/1827690

http://www.quirksmode.org/mobile/viewports.html

我用：

https://github.com/tysonmatanich/viewportSize

var dimensions = (function(){

    var dims = {};

    // get screen width/height:
    dims.screenWidth = function() { window.screen.width };
    dims.screenHeight = function() { return window.screen.height };

    // get screen width/height minus chrome:
    dims.availWidth = function() { return window.screen.availWidth };
    dims.availHeight = function() { return window.screen.availHeight };

    // get document width/height (with-out scrollbars):
    if (window.document.compatMode == "CSS1Compat"){ // if IE Standards Mode
        dims.documentWidth = function() { return document.body.offsetWidth };
        dims.documentHeight = function() { return document.body.offsetHeight };
    }
    else {
        dims.documentWidth = function() { return document.documentElement.offsetWidth };
        dims.documentHeight = function() { return document.documentElement.offsetHeight };
    }

    // get viewport width/height (with scrollbars):
    if (window.innerWidth != null) {
        dims.viewportWidth = function () { return window.innerWidth };
        dims.viewportHeight = function () { return window.innerHeight };
    }

        // if IE in Standards Mode
        else if (window.document.compatMode == "CSS1Compat"){
            dims.viewportWidth = function () { 
                return window.document.documentElement.clientWidth
            };
            dims.viewportHeight = function () { 
                return window.document.documentElement.clientHeight
            };
        }

    // get scrollbar offsets:
    if (window.pageXOffset != null) {
        dims.scrollXOffset = function() { return window.pageXOffset };
        dims.scrollYOffset = function() { return window.pageYOffset };
    }

        // if IE in Standards Mode
        else if (window.document.compatMode == "CSS1Compat"){
            dims.scrollXOffset = function() { return document.documentElement.scrollLeft };
            dims.scrollYOffset = function() { return document.documentElement.scrollTop };  
        }

    return dims;
}());
console.log(dimensions.viewportWidth())

有什么建议吗？

chrome中的视口小于firefox中的视口

0 个答案: