Question

我的网页上有一些页面，我把它放在我的所有HTML代码上：

<div id="footer" data-role="footer" class="clearfix">
        <div id="footerMenu" class="ui-grid-d">
            <div class="ui-block-a footerBlock">
                <a href="index.html"><img src="images/global/bottom_menu/product_active.png" /></a>
            </div>
            <div class="ui-block-b footerBlock">
                <a href="favorite.html"><img src="images/global/bottom_menu/fav.png" /></a>
            </div>
            <div class="ui-block-d footerBlock">
                <a href="about.html"><img src="images/global/bottom_menu/about.png" /></a>
            </div>
            <div class="ui-block-e footerBlock">
                <a href="settings.html"><img src="images/global/bottom_menu/settings.png" /></a>
            </div>
          </div>
    </div>

CSS：

#footerMenu {
    background-color:#23476E;
    position:fixed;
    left:0px;
    bottom:0px;
    width:100%;
    opacity:1 !important;
    display:block;
    z-index:1000;
}

#footerMenu img {
    margin: 0 auto;
    width:96%;
}

.footerBlock a{
    text-align:center;
    display:block;
}

我的JS：

$('#searchResultPage').live('pageshow', function(){
    console.log("height: " + $("#footer").height();
});

然后，我的应用将加载index.html作为第一页，我可以通过$("#footer").height()获得页脚高度，如上所述。但是当我试图从about.html再次获得高度时，高度返回0.

是否有人可以告诉我为什么高度会返回0？

Answer 1

即使已准备好文档，我们很可能还没有加载图像（我最近遇到过这种情况）。由于您没有提供图像大小，因此只要浏览器知道div高度为零。

最简单的解决方案是在<img...>标记中包含图片大小。

Phonegap - 为什么我的div高度返回0？

1 个答案: