2

我制作了一个脚本，可以在页面加载和窗口大小调整时调整网页上某些 div 元素的大小。问题是，当我将 chrome 从窗口更改为全屏时（我并不是指 F11 全屏模式，只是它从边缘到边缘），div 的一小部分变得不可见。它不会发生在任何其他浏览器中。我正在运行最新版本的 chrome。

有这个问题的 div 是#black_line_bottom，你可以在右下角看到#bottom_container div。

调整大小（js）的代码：

function calcHeight(factor){
if($(window).height() > 720){
    return $(window).height() * factor / 100;
}
else{
    return 720 * factor / 100;
}
}

function getEl(x){
return document.getElementById(x)
}

function resizeHeight(){
var height = calcHeight(3.5);
getEl("black_line_bottom").style.height = height + "px";
getEl("white_line_bottom").style.bottom = height + "px";
height = calcHeight(7.8);
getEl("bottom_container").style.height = height + "px";
getEl("white_line_bottom").style.height = (height - calcHeight(3.5)) + "px";
height = calcHeight(20.5);
};

$(window).on( "resize ready" , resizeHeight);

html:

<body>
    <div id = "bottom_container" >
        <div id = "black_line_bottom" class = "black_line">

        </div>
        <div id = "white_line_bottom"class = "white_line">

        </div>
    </div>
</body>

CSS：

.black_line {
position : fixed;
background-color : #0a0a0a;
width : 100%;
height : 41px;
left : 0px;
right : 0px;
}

#black_line_bottom {
bottom : 0px;
}

#bottom_container {
position : fixed;
width : 100%;
height : 90px;
left : 0px;
right : 0px;
bottom : 0px;
}

.white_line {
position : absolute;
background-color : red;
width : 100%;
height : 100%;
left : 0px;
right : 0px;
}

#white_line_bottom {
bottom : 41px;
}
4

1 回答 1

1

我做了一些研究，它似乎是 chrome 中的一个错误。

错误链接： http ://code.google.com/p/chromium/issues/detail?id=151623

于 2012-11-02T17:15:10.370 回答