2011-08-18 3 views
0

여기 거래가 있습니다 ... "radioiframe"이라는 ify로드 된 외부 페이지가 있고 페이지 콘텐츠가있는 로컬 iframe이 있습니다. "radioiframe"에있는 내 src가 비어 있음을 알 수 있습니다. 소스가 javascript (코드 끝)를 통해로드되기 때문입니다. 모든 작품은 완벽하게 작동하지만 오블 문제는 iframe이 표시 될 때 디스플레이를 켜고 내 콘텐츠를 아래로 밀면 숨겨집니다 (오버플로 : 몸에 숨겨져 스크롤 막대가 표시되지 않도록). 필자는 아마 그것을 계산하려고 노력했지만, "radioiframe"의 높이는 34px로 고정되었지만 "content"높이는 모니터 크기와 페이지 내용에 상대적입니다. 필자는 프레임의 높이를 jQuery로 계산 한 다음 높이 ou 34를 빼내 iframe에서 설정하려고했지만 아무 소용이 없었다. 모든 것이 작동하고 있음을 상기시키기 위해서 setSizes 수학 함수를 실행하십시오.iframe에 대한 높이 비율 math javascript

프레임 페이지의 HTML.

<div id="radiodiv"> 
<iframe src="" id="radioiframe" height="34px" width="100%" marginwidth="0" marginheight="0" frameborder="0" vspace="0" hspace="0" scrolling="no" allowtransparency="true" style="display:none;"></iframe></div> 

<div id="contentdiv"> 
<iframe src="home2.php" id="content" name="content" height="100%" width="100%" frameborder="0" scrolling="auto" marginwidth="0" marginheight="0" vspace="0" hspace="0"></iframe></div> 

<script type="text/javascript"> 
function setSizes() { 
var containerHeight = $("#content").height(); 
document.getElementById('content').height = containerHeight - 34; 
} 
</script> 

자바 스크립트로드 소스 :

function ShowSaburi(){ 
parent.document.getElementById('radioiframe').src = 'http://www.saburimusic.com/player.php'; 
parent.document.getElementById('radioiframe').style.display = 'block'; 
}; 

function ShowNero(){ 
parent.document.getElementById('radioiframe').src = 'http://www.radionero.com/player.php'; 
parent.document.getElementById('radioiframe').style.display = 'block'; 
}; 

function HideRadio(){ 
parent.document.getElementById('radioiframe').src = ''; 
parent.document.getElementById('radioiframe').style.display = 'none'; 
}; 

답변

0

설정 오버 플로우와 스타일링 contentdiv에 대해

<div id="contentdiv" style="overflow: scroll;"> 
    <iframe src="home2.php" id="content" name="content" height="200px" width="100%" frameborder="0" scrolling="auto" marginwidth="0" marginheight="0" vspace="0" hspace="0"></iframe> 
</div> 

당신이 윈도우의 최대 높이로 DIV의 높이를 설정할 수 있습니다 이동하는 방법 라디오 프레임의 경우 34px 미만입니다.

희망이 도움이됩니다.

function ShowSaburi() { 
// your methods 
// add this 
setContentHeight(); 
} 

function setContentHeight() { 
    var docHeight = $(document).height(); 
    if (docHeight){ 
     var contentHeight = docHeight - 40; 
     $('#contentdiv').css({'height': contentHeight+ 'px'}); 
    } 
} 

그냥 생각해보십시오.

+0

div가 프레임 된 페이지의 높이를 얻지 만 상위 페이지의 높이를 얻지 못하기 때문에 작동하지 않습니다. –

+0

일부 코드를 사용하여 작동시킬 수 있지만 조금 이유가 있습니다 크롬에서 그것은 약간의 바닥을 자른다? IE와 파이어 폭스에서 완벽합니다. –

+0

$ (문서) .ready (기능 autoHeight를() { \t VAR docHeight = $ (문서) .height의();.. \t VAR의 radioHeight = 부모 $ ("#의 radioiframe")의 높이(); \t 경우 (var contentHeight = docHeight - radioHeight; –