0

我的网站上有一些页面，我把它放在我所有的 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 吗？

4

1 回答 1

0

即使 document-ready 已经触发，图像也很可能尚未加载（我最近遇到了这个问题）。由于您没有提供图像尺寸，就浏览器所知，div 高度为零。

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

于 2013-03-14T03:59:46.650 回答