Javascript/CSS: establecer (Firefox) nivel de zoom de iframe?

Question

Me gustaría crear una página con múltiples iframes que muestren diferentes páginas, una especie de tipo "navegar varias páginas juntas". El problema es que al hacerlo, las ventanas gráficas son bastante pequeñas y solo puedo ver la esquina superior izquierda de cada página.

¿Hay alguna manera de configurar el iframe para que realice de manera efectiva el alejamiento de firefox (ctrl-minus) varias veces para que toda la página esté visible? No me importa especialmente si el texto es legible, solo si básicamente puedo ver cómo se ve la página.

No necesito que esto sea de navegador cruzado (para mis propósitos solo necesita trabajar en el último Firefox) aunque obviamente una solución de navegador cruzado sería preferible por el bien de cualquiera que lo necesite y se tropieza a través de esta pregunta.

Answer 1

Puede aplicar transformaciones CSS a 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 propiedad origen transformar permite que se puede escalar sin cambiar su posición.

Esto funciona para Webkit, Opera, FF e IE9 (no probado). El texto se ve muy bien y sigue siendo legible en tamaños muy pequeños.

Answer 2

me dieron resultados adecuados como este (probado sólo en cromo):

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> 

Tal vez esto ayude.