2012-04-02 2 views
1

jQuery 대화 상자 'dialogresize'이벤트 중에 content div의 높이를 설정하면 div의 높이가 변경되지 않습니다.dialogresize 이벤트에서 jQuery 대화 상자 내용 크기 조정

참조 예 : http://jsfiddle.net

<div id='myDialog'> 
    <p>some text</p> 
    <div id='resizeToParent' style='overflow: scroll'> 
     <div style="background: #ffc; width: 100px; height: 200px;"></div> 
    </div> 
<div> 

으로는 나는 'resizeToParent'사업부가 대화 상자 내부에 남아있는 사용 가능한 공간의 100 %를 차지하고자합니다. 이것을하기 위해; dialogresize에 함수를 바인딩하고 부작용으로 div의 높이와 안쪽 div의 부모를 표시하고 div의 높이를 설정합니다.

$('#myDialog').bind("dialogresize", function (event, ui) { 
$('#myDialog #resizeToParent') 
     .css('height', $('#myDialog').css('height') - 200); 

그러나 'resizeToParent'div의 높이는 변경되지 않습니다. 내가 도대체 ​​뭘 잘못하고있는 겁니까?

답변

1

확인이 바이올린 : http://jsfiddle.net/S3FQv/

솔루션 : 부모의 계산 높이를 읽기 위해 .height() 대신 .css('height')를 사용합니다.

+2

감사합니다. 이것은 css (height)가 끝에 "px"가있는 문자열을 반환하기 때문에 지금 당연한 것 같습니다. 도! –

관련 문제