전체 페이지 확대/축소가 가능한 브라우저를 사용하면이 기능을 사용하여 iframe의 확대/축소를 설정할 수 있습니까?

Question

모든 브라우저에는 요즘에는 사용자가 제어하는 ​​전체 페이지 확대/축소가 있다고 생각합니다. 어쨌든 개발자, HTML, CSS 또는 자바 스크립트를 통해 액세스 할 수 있습니까?

iframe 또는 일반 프레임을 제공하고 50 % 확대/축소로 설정하고 싶습니다. (포함 된 문서의 현재 줌에 비해 이상적입니다.)

모두 가능합니까? 기존 기능 구현이있는 한 HTML 5 솔루션인지 여부는 신경 쓰지 않습니다. 비록 야간에 건설된다고해도.

적어도 WebKit 및 Gecko와 함께 작업하면 매우 행복 할 것이고, Trident에도 보너스가 주어집니다.

div.zoom { zoom: 200%; } 

<div class="zoom"> 
    <p>Hello World</p> 
</div> 

이 하지 업무 단지 ifarme 태그에 추가하여합니다 :

<iframe id="myFrame" class="zoom" /> <!-- doesn't work --> 

당신이해야 내가 생각할 수있는

Answer 1

다음은 Safari 4.0.2 및 최신 WebKit에서 밤에는 작동합니다. 그러나 Google 크롬 (Windows 또는 Mac)에서는 작동하지 않습니다.

파이어 폭스 3.5와 IE 8.0에서는 아무런 관련이 없습니다. 또한, 야간에 최신 카미노에 거래. 이 같은

또한 FF 수행 할 수 있습니다

<style type="text/css" media="screen"> 
    iframe { 
    width : 500px; 
    height : 250px; 
    } 
</style> 

<script type="text/javascript" charset="utf-8"> 
    function setZoom(element, zoom) { 
    element.style.zoom = (zoom || 50) + '%' 
    } 
</script> 

<p>Hello World</p> 

<iframe 
    src = 'http://google.com' 
    onload = "setZoom(this.contentDocument.body)" 
    /> 

Answer 2

가장 가까운 것은 CSS3에서 Zoom입니다 BODY 또는 wrapper-div 중 하나 인 iframe DOM 자체의 콘텐츠 태그에 적용합니다.

그 외에도 다른 브라우저를 지원하는 방법을 모르겠습니다.

Answer 3

는 :

iframe { 
-moz-transform: scale(0.5, 0.5); /* 50% */ 
} 

그것은 좋은 작품!

확인 : https://developer.mozilla.org/en/CSS/-moz-transform

Answer 4

이 HTML5와 나를 위해 일하는 CSS3 코드는 다음과 같습니다 8 IE 6 줌, 현대적인 브라우저의 나머지 부분에 대한 스케일을 변환.

#iframe{ 
    zoom: 0.75; 
    -moz-transform: scale(0.75); 
    -moz-transform-origin: 0 0; 
    -o-transform: scale(0.75); 
    -o-transform-origin: 0 0; 
    -webkit-transform: scale(0.75); 
    -webkit-transform-origin: 0 0; } 

Firefox 3.5 이상, Safari 3.1, Chrome 4.0, Opera 10.5가 지원됩니다.

과 같은 JS 또는 JQuery 솔루션은 xy 축과 오프셋을 기반으로 사용자 정의 된 내장 함수가 포함 된 이전 버전의 브라우저에서 작동합니다.

경로가 xy 축 기능을 사용하지만 미리 만들어진 축소 형 코드를 찾을 수 없다고 생각합니다.