Zoom para ajustar: PDF incrustado en HTML


84

Estoy incrustando un archivo pdf local en una página web simple y estoy buscando establecer el zoom inicial para que se ajuste al tamaño del objeto. Esto es lo que intenté pero no afecta el zoom.

 <embed src="filename.pdf?zoom=50" width="575" height="500">

¿Alguien sabe cómo modificar el código para que su zoom inicial se ajuste al tamaño del objeto?


¿Qué pasa con esto ?
Irgendw Pointer

el modificador que tengo en el código en este momento no está afectando el zoom del archivo pdf, necesito averiguar cómo hacer que el zoom se ajuste al objeto inicialmente
user3024833

Respuestas:


164

Una respuesta un poco tardía, pero noté que esta información puede ser difícil de encontrar y no he encontrado la respuesta en SO, así que aquí está.

Pruebe un parámetro diferente # view = FitH para forzarlo a que encaje en el espacio horzontal y también debe iniciar la cadena de consulta con un # en lugar de un & haciéndolo:

filename.pdf#view=FitH

Lo que he notado es que esto funcionará si adobe reader está integrado en el navegador, pero Chrome usará su propia versión del lector y no responderá de la misma manera. En mi propio caso, el navegador Chrome se amplió para ajustarse al ancho de forma predeterminada, por lo que no hay problema, pero Internet Explorer necesitaba los parámetros anteriores para garantizar que el enlace siempre abriera la página PDF con la configuración de vista correcta.

Para obtener una lista completa de los parámetros disponibles, consulte este documento.

EDITAR: (modo perezoso activado)

ingrese la descripción de la imagen aquí ingrese la descripción de la imagen aquí ingrese la descripción de la imagen aquí ingrese la descripción de la imagen aquí ingrese la descripción de la imagen aquí


2
Esto fue genial. ¿Cómo lo fuerzo a reajustar la página FitHcuando cambio el tamaño de la ventana del navegador?
Vishal

5
La documentación de los parámetros en la URL, mencionada anteriormente, se ha trasladado a este enlace adobe.com/content/dam/Adobe/en/devnet/acrobat/pdfs/…
RominNoodleSamurai

3
¿Por qué no eres la respuesta votada :) Muchas gracias!
Martin Eckleben

¿Hay alguna forma de cambiar el color del contenedor de fondo del elemento <embed>? Veo gris fuera del documento pero dentro del elemento. Preferiría que sea transparente o heredado del elemento.
Vishal

No pude hacerlo funcionar en Edge. El navegador ignoró los parámetros. Chrome admite al menos algunos de ellos (por ejemplo, vista, zoom, página).
Josef Bláha

23

Para mí, esto funcionó (quería acercarme ya que el contenedor de mi pdf era pequeño):

    <embed src="filename.pdf#page=1&zoom=300" width="575" height="500">

2
# zoom = 50 o # page = 2 & zoom = 300 funcionan perfectamente tanto en Chrome como en IE. IE solo parece responder a # view = Fit. Más parámetros de IE aquí: partners.adobe.com/public/developer/en/acrobat/…
Sergiu Z

1
Tenía un PDF de varias páginas y # zoom = 100 funcionó para mí.
adrianp

4

Este método usa "objeto", también tiene "incrustación". Cualquiera de los métodos funciona:

<div id="pdf">
    <object id="pdf_content" width="100%" height="1500px" type="application/pdf" trusted="yes" application="yes" title="Assembly" data="Assembly.pdf?#zoom=100&scrollbar=1&toolbar=1&navpanes=1">
    <!-- <embed src="Assembly.pdf" width="100%" height="100%" type="application/x-pdf" trusted="yes" application="yes" title="Assembly">
    </embed> -->
    <p>System Error - This PDF cannot be displayed, please contact IT.</p>
    </object>
</div>

1

Respuesta un poco tardía a esta pregunta, sin embargo, tengo algo que agregar que podría ser útil para otros.

Si utiliza un iFrame y establece la ruta del archivo pdf en src, se cargará alejado al 100%, lo que equivale a FitH


1

en caso de que alguien lo necesite, en firefox para mí funciona así

<iframe src="filename.pdf#zoom=FitH" style="position:absolute;right:0; top:0; bottom:0; width:100%;"></iframe>

0

Use la etiqueta iframe para mostrar el archivo pdf con ajuste de zoom

<iframe src="filename.pdf" width="" height="" border="0"></iframe>
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.