easyXDM은 신비한 추가 높이를 iframe에 추가합니다.

Question

부모 웹 사이트의 iframe에 서비스 제공 업체의 콘텐츠를 배치해야합니다. iframe 콘텐츠의 높이는 사용자 상호 작용에 따라 동적으로 변경됩니다.

문제 iframe에 몇 가지 추가 높이가 추가되어 있습니다. 나는 높이가 어디서 오는지 모르겠습니다.

감사합니다.

LINK TO PAGE

Answer 1

나는이 easyXDM의 장애로 생각하지 않는다.

계산되는 높이는 iframe의 현재 너비에 대한 것 같습니다. HTML 파일에서 28 행을 제거하면 높이가 완전히 채워져 있음을 알 수 있습니다. 이 디버거에서 코드를 수정하기 어렵다 때문에 (또는 다음 라인), 다음을

this.container.getElementsByTagName("iframe")[0].style.width = "500px"; 

을 (또는 당신은 결과를 그대로 코드를두고 개발자 도구에 높이 스타일을 사용하지 않고 볼 수 있습니다) 내가 시도 할 일은 컨텐츠와 계산 된 높이로 채우기 전에 원하는 너비로 너비를 설정하는 것입니다.

Answer 2

동일한 문제가 발생했습니다. iframe 요소에 높이를 할당하면 모든 iframe에 높이를 할당하지 마십시오. 광고 및 소셜 미디어 플러그인의 iframe에 영향을주기 때문입니다.

그래서 나는 빈 iframe을의 경우

$('#divID iframe').height(easyXDMmessage); 
$('#divID iframe').width('100%'); 

Answer 3

다음, 당신이 0 픽셀의 높이를 설정 한 경우, 부모 블록 요소는 여전히 비어있는 적어도 하나 개의 라인을 보여줍니다 문제로 실행했다 본문. 이는 iframe이 실제로 인라인 요소이기 때문에 iframe 자체의 높이가 0 인 경우에도 부모 블록이 한 줄의 텍스트를 계속 표시합니다. 다음은 간단한 수정입니다.

iframe#my_iframe { display:block; }