Javascript/CSS：iframeのズームレベルを（firefox）に設定しますか？

Question

さまざまなページを表示する複数のiframeを持つページを作成したいと思っています。一種の「複数のページを並べて閲覧する」タイプのものです。問題は、そうすることでビューポートがかなり小さくなり、各ページの左上隅のみが表示されることです。

効果的にfirefoxのズームアウト（ctrl-minus）を数回行うことでページ全体が見えるようにiframeを設定する方法はありますか？テキストが見やすいかどうかは特に気にしません。ページがどのように見えるのかが分かります。

これはブラウザを必要としません（私の目的のためには最新のFirefoxでしか動作しません）が、明らかにクロスブラウザーの解決策がこれを必要とし、誰かのために望ましいでしょうこの質問の向こう側に。

Answer 1

あなたは、CSSは、アイフレームへの変換を適用することができます。

iframe { 
    -moz-transform: scale(0.25, 0.25); 
    -webkit-transform: scale(0.25, 0.25); 
    -o-transform: scale(0.25, 0.25); 
    -ms-transform: scale(0.25, 0.25); 
    transform: scale(0.25, 0.25); 
    -moz-transform-origin: top left; 
    -webkit-transform-origin: top left; 
    -o-transform-origin: top left; 
    -ms-transform-origin: top left; 
    transform-origin: top left; 
    border: solid #ccc 10px; 
} 

http://jsfiddle.net/6QMcX/

変換元のプロパティは、それがその位置を変えずに拡大縮小することができます。

これは、Webkit、Opera、FF、IE9（未テスト）で動作します。テキストはすばらしく見え、非常に小さいサイズでは読みやすいです。

Answer 2

私は（クロムのみでテスト）このような適切な結果だ：

CSS：

<style> 
#iframe { 
    -moz-transform: scale(0.25, 0.25) translate(-150%, -150%); 
    -webkit-transform: scale(0.25, 0.25) translate(-150%, -150%); 
    -o-transform: scale(0.25, 0.25) translate(-150%, -150%); 
    transform: scale(0.25, 0.25) translate(-150%, -150%); 
} 
#wrapper { 
    width: 256px; 
    height: 230px; 
} 
</style> 

HTML： 

<div id="wrapper"> 
    <iframe id="iframe" width="1024" height="920" scrollbars="no"></iframe> 
</div> 

多分これは役立ちますが。