2012-04-14 2 views
0

입니다. 현재 웹 사이트를 만들고 있는데, 하위 항목 중 하나의 오프셋에 따라 div 크기를 조정해야합니다. 문제없이 파이어 폭스 따라 트리거되는 이벤트입니다,div 크기에 따라 콘텐츠 내용이

<script type="text/javascript"> 

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

</script> 

을하지만 : 그래서, 이런 식으로하고 있어요. 그러나 크롬과 함께 작동합니다. div 크기를 일치시키는 더 깨끗한 방법이 있습니까? 그렇지 않다면 파이어 폭스에 의해 그것을 trigged하게하는 방법이 있습니까?

<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> 

편집 : 여기 내 HTML 코드 나는 포기, 난 내 첫 번째 문제가 아닌 JQuery와 하나를 해결 다른 해결 방법을 찾았습니다.

답변

0

DOMready 이벤트가 발생하면 모든 너비와 높이가 아직 계산되지 않을 수 있습니다. DOMready 이벤트는 페이지 구조가 작동 할 준비가되었을 때 시작되며 css가로드되지 않은 경우 시작되지 않습니다. 페이지의 모든 자산이로드 될 때 화재의로드 이벤트에 이런 종류의 일을

봅니다, CSS를 포함 :

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

이 이벤트는 firefox, chrome 모두 해고되지 않습니다. http://178.33.232.214/을보십시오 : 문제는 자식 div 콘텐츠에 의해 크기가 조정되지 않는 div입니다 (차단기가있는 경우에는 차단하지 말고 무시하십시오). –

0

문제가 거의 확실 사실에 의한 당신이 '있다 JS에 변수로 ID가 미리 채워져있는 것처럼 DOM 요소를 다시 처리합니다.

현재 갖고있는 것 대신 $('#sizer')$('#maincnt')을 시도하십시오.

왜 절대적으로 배치 된 요소를 사용하고 있습니까? 설정하는 데 문제가있어 : margin: 12px 0px 0px 10px; width: 750px;?

관련 문제