0

我的背景图像周围有一条细线或边框。我正在通过javascript动态更改父div的高度，以便内部div（具有背景图像集）将“粘”到窗口底部。

桌面浏览器上不会出现线条，但在脚本运行后的移动浏览器上，通常会在其周围出现一个细边框：

在此处输入图像描述

边界在左边，它应该的方式在右边。有什么建议么？

这是脚本：

<script type="text/javascript">
function layoutHandler(){
    if(window.innerHeight > 1061){
    var newsize = 150 + (window.innerHeight - 1061);

        document.getElementById("footerwrapper").style.height = newsize+'px';
    }
    else {
        document.getElementById("footerwrapper").style.height = '150px';
    }
}
window.onload = layoutHandler;

window.onresize = layoutHandler;
layoutHandler();
</script>

然后内部 div 设置如下：

#inner {
    background-color: #FFF;
    padding: 0px;
    height: 150px;
    bottom: 0px;
    width: 100%;
    position: absolute;
    background-image: url(Images/grad.png);
    background-repeat: repeat-x;
}

编辑： 好的，在对此进行了更多测试后，我缩小了范围。（这可能会令人沮丧）它在 iPad 的纵向模式下最为明显。我关闭了“repeat-x”，它完全消失了。这让我尝试了一个更宽的背景图像，它不会在 iPad 的宽度内重复，它消除了这个问题。任何想法为什么会发生这种情况？

4

1 回答 1

0

我有同样的问题，删除repeat-x解决了它。我认为这是手机浏览器的错误。

于 2013-08-10T14:35:55.713 回答