html - 根据其内容的 div 大小

Question

我目前正在创建一个网站，我需要根据其中一个子元素的偏移量来调整 div 的大小。所以，我是这样做的:

<script type="text/javascript">

      $(document).ready(function(){ 
        if($(sizer)[0].scrollHeight > 500)
        {
            $(maincnt).height( ($(sizer)[0].scrollHeight + 300) );
        }
      });

</script>

但是，问题是 Firefox 不会触发该事件。但是使用 chrome 就可以了。是否有更简洁的方法来调整 div 大小？如果没有，有没有办法让它被 Firefox 触发？这是我的 HTML 代码:

<div id="maincnt" >
<div style="position:relative;">
<div id="sizer" style="position:absolute;top:12px;left:10px;width:750px;">
   <!-- Dynamically added things -->
</div>
</div>
</div>

编辑:我放弃了，我找到了另一个解决我的第一个问题的解决方法，而不是 JQuery 问题。

Answer 1

问题可能是当 DOMready 事件被触发时，浏览器还没有计算所有的宽度和高度。 DOMready 事件在页面结构准备好使用时触发，而不是在加载 css 时触发。

尝试在加载事件上做这种工作，当加载页面的所有 Assets 时触发，包括 css:

$(window).load(function(){ 
    if($(sizer)[0].scrollHeight > 500) {
        $(maincnt).height( ($(sizer)[0].scrollHeight + 300) );
    }
});