Javascript / CSS: set (firefox) niveau de zoom de iframe?

Je voudrais créer une page avec plusieurs iframes affichant différentes pages – une sorte de "parcourir plusieurs pages côte à côte". Le problème est que ce faisant, les vues sont assez petites et je ne peux que voir le coin supérieur gauche de chaque page.

Existe-t-il un moyen de configurer l'iframe pour faire efficacement le zoom-out de Firefox (ctrl-minus) quelques fois afin que toute la page soit visible? Je ne m'intéresse pas particulièrement si le texte est lisible, seulement si je peux voir essentiellement la page.

Je n'ai pas besoin de cela pour être un navigateur croisé (pour mes besoins, il ne faut que fonctionner dans le dernier firefox) bien que, évidemment, une solution de navigateur croisé soit préférable pour le bien de quelqu'un d'autre qui a besoin de cela et trébuche à travers cette question.

Vous pouvez appliquer les transformées css aux iframes:

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/

La propriété d'origine transformée permet d'être mise à l'échelle sans changer sa position.

Cela fonctionne pour Webkit, Opera, FF et IE9 (non testé). Le texte semble génial et est toujours lisible à très petites tailles.

J'ai eu des résultats appropriés comme ceci (testé uniquement dans Chromium):

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> 

Peut être que cela aide.