incruste archivo PDF en html utilizando la etiqueta de objeto

Estoy insertando un documento pdf en mi código html. Para esto he escrito este código.incruste archivo PDF en html utilizando la etiqueta de objeto

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org 

/TR/html4/loose.dtd"> 
<html lang="en"> 
<head> 
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> 
    <title></title> 
</head> 
<body> 
<object height="100%" width="100%" type="application/pdf" data="yii.pdf#toolbar=1&amp;navpanes=0&amp;scrollbar=1&amp;page=1&amp;view=FitH"> 

<p>It appears you don't have a PDF plugin for this browser. No biggie... you can <a href="/pdf/sample.pdf">click here to download the PDF file.</a></p> 

</object> 

</body> 
</html>

Pero resultado es la página vacía en FF4 e IE9 incrusta archivo PDF, pero el envase es muy pequeño, casi el 30% de la página. si elimino la primera línea, es decir, DOCTYPE, ambos navegadores renderizan el archivo pdf como debería. El siguiente código funciona bien.

<html lang="en"> 
<head> 
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> 
    <title></title> 
</head> 
<body> 
<object height="100%" width="100%" type="application/pdf" data="yii.pdf#toolbar=1&amp;navpanes=0&amp;scrollbar=1&amp;page=1&amp;view=FitH"> 

<p>It appears you don't have a PDF plugin for this browser. No biggie... you can <a href="/pdf/sample.pdf">click here to download the PDF file.</a></p> 

</object> 

</body> 
</html>

Quiero usar doctype en mi página para que otras páginas funcionen bien. ¿Hay alguna manera de arreglar el primer código que contiene doctype?

Fuente

2011-05-31 mysterious

Lo intentaría con un elemento .
De lo contrario, tal vez lo convierta en flash y luego incruste el flash.

Además, trate <!doctype html> y ver lo que hace, ese es el tipo de documento estándar para HTML5

Fuente

2011-05-31 09:52:11 tXK

Subida de nivel 6 años después porque 'iframe' parece que todavía es el camino a seguir. –

Esto es básicamente @ respuesta de TXK (1), pero con el trabajo (probado batalla) código:

<!DOCTYPE html> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
<title>Preview</title> 
<style type="text/css"> 
html, body { 
    margin: 0; 
    padding: 0; 
    border: 0; 

    height: 100%; 
    overflow: hidden; 
} 
iframe { 
    width: 100%; 
    height: 100%; 
    border: 0 
} 
</style> 
</head> 

<body> 

<iframe src=""></iframe> 

</body> 
</html>

Fuente

2011-05-31 10:00:37 thirtydot

Gracias! funciona a la perfección, exactamente lo que necesitaba. –

Hay TRES formas de mostrar un PDF en HTML: utilizando incrustación, objeto o iframe. Lamentablemente, al usar iframe no se permitirá el Adobe Javascript dentro del PDF para publicar mensajes en el JS en HTML, porque el hostContainer no está definido. Por lo tanto, estoy obligado a usar incrustar u objeto. Afortunadamente thirtydot 's código de estilo también funciona muy bien para el objeto. Aquí está mi código de trabajo ...

<!DOCTYPE html> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
<title>Preview</title> 
<style type="text/css"> 
html, body { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    height: 100%; 
    overflow: hidden; 
} 
object { 
    width: 100%; 
    height: 100%; 
    border: 0 
} 
</style> 
<script language="javascript"> 
    function handleMessage(msg) { 
     alert('got message '+msg); 
    } 
    function setupHandler() { 
     document.getElementById("myPdf").messageHandler = { onMessage: handleMessage }; 
    } 
</script> 
</head> 
<body onLoad="setupHandler();"> 
<object id="myPdf" type="application/pdf" data="file_with_actions.pdf"> 
Unable to open the PDF file. 
</object> 
</body> 
</html>

Puede leer más sobre la materia Javascript here.

Fuente

2013-10-01 18:53:58

Otro descubrimiento: si está utilizando SWT Browser para mostrar un PDF, no use setText o el hostContainer no está definido. Debe usar setURL (es decir, colocar el texto en un archivo temporal). –

incruste archivo PDF en html utilizando la etiqueta de objeto

Respuesta

Cuestiones relacionadas