2012-06-01 3 views
0

저는 맞춤식 콘텐츠 관리 시스템을 보유하고 있습니다. 콘텐츠를 변경하려면 CKEditor를 사용하고 있습니다. 편집 후 제출 버튼을 클릭하면 웹 페이지의 실시간 미리보기가 필요합니다. iframe을 사용하고 있지만 웹 페이지의 크기가 더 크기 때문에 가로 및 세로 스크롤 막대가 표시됩니다.작은 iframe에서 전체 웹 페이지를 렌더링하는 방법은 무엇입니까?

전체 페이지를보기 위해 특정 차원에서 수행하고 싶습니다. 웹 페이지를 더 작은 크기로 렌더링한다는 것을 의미합니다. 심지어 그것은 어떤 문제도없는 웹 페이지의 이미지입니다.

답변

1

나는 css3please 사랑 :

<style type="text/css"> 
.box_scale { 
       width:300px; 
      height:300px; 
    -webkit-transform: scale(0.5); /* Saf3.1+, Chrome */ 
    -moz-transform: scale(0.5); /* FF3.5+ */ 
     -ms-transform: scale(0.5); /* IE9 */ 
     -o-transform: scale(0.5); /* Opera 10.5+ */ 
      transform: scale(0.5); 
      filter: progid:DXImageTransform.Microsoft.Matrix(/* IE6–IE9 */ 
        M11=0.9999619230641713, M12=-0.008726535498373935, M21=0.008726535498373935, M22=0.9999619230641713,SizingMethod='auto expand'); 
} 

</style> 

<div class="box_scale"> 
    <iframe width="300" height="300" src="http://example.org"></iframe> 
</div> 

규모를 선택 외에 유일한 것은 사업부에 너비와 높이를 추가하는 것이 었습니다. 물론 변환 원점에 대한 규칙을 추가 할 수도 있습니다. 참고 : https://developer.mozilla.org/en/CSS/transform

+0

일부 PHP를 추가하면 iFrame의 크기 축소로 조정할 수 있습니다. – Peter

+0

작동하지 않음 :(확실하지 않음, 누락 된 경우 확실하지 않음 iframe의 절반 크기이지만 전체 렌더링이 없음 .. – Nitesh

+0

일부 사이트 (현재 mdn 포함)에 리디렉션이있는 것 같습니다. 코드를 전달하거나, 콘텐츠가 iframe에 * 표시 될 경우 콘텐츠를 숨기십시오. example.org로 변경 – JayC

관련 문제