come incorporare file PDF con larghezza reattivo

sto embedding file PDF utilizzando qualcosa di simile:come incorporare file PDF con larghezza reattivo

<div class="graph-outline"> 
    <object style="width:100%;" data="path/to/file.pdf?#zoom=85&scrollbar=0&toolbar=0&navpanes=0" type="application/pdf"> 
    <embed src="path/to/file.pdf?#zoom=85&scrollbar=0&toolbar=0&navpanes=0" type="application/pdf" /> 
    </object> 
</div>

Funziona ma voglio impostare la larghezza pdf in modo che corrisponda alla larghezza del div contenitore. Attualmente si presenta come un iframe con barre di scorrimento, quindi per visualizzare l'intero pdf, devi scorrere da destra a sinistra. Voglio che il pdf si adatti alla larghezza del contenitore.

Come posso risolvere questo problema? Sto supportando IE8 e versioni successive.

Ecco un jsfiddle: http://jsfiddle.net/s_d_p/KTkcj/

fonte

2013-05-09 emersonthis

possibile duplicato di [? E 'possibile avere un file PDF aperto con un ingrandimento predefinito in Adobe Reader] (http://stackoverflow.com/questions/770473/è-è-possibile-avere-un-pdf-file-aperto-a-un-ingrandimento-predefinito-in-adobe-re) –

controllare questo link fuori: [SO - Q-> A] (http://stackoverflow.com/questions/770473/is-it-possible-to-have-a-pdf-file-open-at-a-predefined-magnification-in-adobe-re) e [parametri pagina 6] (http://partners.adobe.com/public/developer/en/acrobat/PDFOpenParameters.pdf) –

@winner_joiner: questo il metodo non influisce sul visualizzatore pdf nei browser – dashhund

<html> 
<head> 
<style type="text/css"> 
#wrapper{ width:100%; float:left; height:auto; border:1px solid #5694cf;} 
</style> 
</head> 
<div id="wrapper"> 
<object data="http://partners.adobe.com/public/developer/en/acrobat/PDFOpenParameters.pdf" width="100%" height="100%"> 
<p>Your web browser doesn't have a PDF Plugin. Instead you can <a href="http://partners.adobe.com/public/developer/en/acrobat/PDFOpenParameters.pdf"> Click 
here to download the PDF</a></p> 
</object> 
</div> 
</html>

fonte

2014-05-13 10:00:07

la larghezza reattiva si riferisce al pdf effettivo all'interno dell'oggetto pdf-viewer, non l'oggetto che ospita il visualizzatore di pdf – dashhund

solo simpl fare questo: -

<object data="resume.pdf" type="application/pdf" width="100%" height="800px"> 
    <p>It appears you don't have a PDF plugin for this browser. 
    No biggie... you can <a href="resume.pdf">click here to 
    download the PDF file.</a></p> 
</object> 
</div>

fonte

2014-06-20 14:36:38 dhanasekar

Questo funziona bene, creato http://dabblet.com/gist/1cddeeb1cbc89f0a9061 per testare anche questo, giocare con le larghezze e l'altezza – Carlton

ho fatto questo errore una volta - l'incorporamento file PDF in pagine HTML. Ti suggerisco di utilizzare una libreria JavaScript per visualizzare il contenuto del PDF. Come https://github.com/mozilla/pdf.js/

fonte

2014-11-04 21:04:58 chrwahl

Non è perfetto purtroppo . Ma molti dei PDF che ho provato sembrano terribili a causa di un problema con i font. (Chrome 38/Windows 7) – dakotapearl

Se si sta utilizzando Bootstrap 3, è possibile utilizzare la classe di tipo embed-responsive e impostare il fondo del padding come altezza divisa per la larghezza più un piccolo extra per le barre degli strumenti. Ad esempio, per visualizzare un PDF 8,5 x 11, utilizzare il 130% (11/8,5) più un piccolo extra (20%).

<div class='embed-responsive' style='padding-bottom:150%'> 
    <object data='URL.pdf' type='application/pdf' width='100%' height='100%'></object> 
</div>

Ecco il CSS Bootstrap:

.embed-responsive { 
    position: relative; 
    display: block; 
    height: 0; 
    padding: 0; 
    overflow: hidden; 
}

fonte

2016-03-18 18:38:08

come incorporare file PDF con larghezza reattivo

risposta

Problemi correlati