Come posso visualizzare un pdf all'interno di un browser web su una pagina .html?
Risposte:
Uso il visualizzatore PDF incorporabile di Google Documenti. I documenti non devono essere caricati su Google Docs, ma devono essere disponibili online.
<iframe src="http://docs.google.com/gview?url=http://path.com/to/your/pdf.pdf&embedded=true"
style="width:600px; height:500px;" frameborder="0"></iframe>
invece di usare iframe e, a seconda del pensiero di terze parti, sull'utilizzo di flexpaper o pdf.js.
Ho usato PDF.js , funziona bene per me. Ecco la demo .
preferito utilizzando il tag object
<object data='http://website.com/nameoffolder/documentname.pdf#toolbar=1'
type='application/pdf'
width='100%'
height='700px'>
nota che puoi modificare la larghezza e l'altezza con qualsiasi valore che visiti http://www.w3schools.com/tags/tag_object.asp
Il modo più semplice è creare un iframe e impostare l'origine sull'URL del PDF.
(Duck pazzi designer HTML) Fatto da solo, funziona bene, cross browser (striscia nel bunker).
Il plugin del browser controlla queste impostazioni, quindi non puoi forzarlo. Tuttavia, puoi fare un semplice <a href="whatver.pdf">invece di <a href="whatever.pdf" target="_blank">.
Finché ospiti il PDF, l'attributo di destinazione è la strada da percorrere. In altre parole, per i file relativi, l'utilizzo dell'attributo target con il valore _blank funzionerà perfettamente.
<e>
<a target="_blank" alt="StackExchange Handbook" title="StackExchange Handbook"
href="pdfs/StackExchange_Handbook.pdf">StackExchange Handbook</a>
Per percorsi assoluti motori andranno al U nified R eSource L ocator e aprirlo loro. Quindi, sopprimi l'attributo target.
<e>
<a alt="StackExchange Handbook" title="StackExchange Handbook"
href="protocol://url/StackExchange_Handbook.pdf">StackExchange Handbook</a>
I browser faranno un buon lavoro in entrambi i casi.
Puoi anche incorporare utilizzando JavaScript tramite una soluzione di terze parti come PDFObject .
Puoi usare questo codice:
<embed src="http://domain.com/your_pdf.pdf" width="600" height="500" alt="pdf" pluginspage="http://www.adobe.com/products/acrobat/readstep2.html">
Oppure utilizza il visualizzatore PDF incorporabile di Google Documenti:
<iframe src="http://docs.google.com/gview?url=http://domain.com/your_pdf.pdf&embedded=true"
style="width:600px; height:500px;" frameborder="0"></iframe>
Puoi anche avere questo semplice approccio GoogleDoc.
<a style="color: green;" href="http://docs.google.com/gview?url=http://domain//docs/<?php echo $row['docname'] ;?>" target="_blank">View</a>
Ciò creerebbe una nuova pagina per visualizzare il documento senza distorcere il flusso.
La soluzione semplice è metterlo in un iframe e sperare che l'utente disponga di un plug-in che lo supporti.
(Non lo so, il plugin Acrobat è stato un tale maiale di risorse e fonte di instabilità che mi impegno a rimuoverlo da qualsiasi browser che tocchi).
La soluzione complicata, ma relativamente popolare, è visualizzarlo in un'applet flash.
Rendiamo le pagine del file PDF come file PNG sul server usando JPedal (una libreria java). Questo, combinato con un po 'di javascript, ci offre un elevato controllo sulla visualizzazione e la navigazione.
Recentemente avevo bisogno di fornire una versione più mobile-friendly e reattiva di un documento .pdf, perché gli schermi stretti del telefono richiedevano lo scorrimento a destra ea sinistra molto. Per consentire solo lo scorrimento verticale ed evitare lo scorrimento orizzontale, i seguenti passaggi hanno funzionato per me:
Il risultato sembrava buono ed era utilizzabile sia in ambienti desktop che mobili.
La visualizzazione del contenuto salvato in formato file PDF / DOC / DOCX è ideale per visualizzare il file pdf / doc / docx sulla tua pagina web
Hai provato a utilizzare un semplice tag img?
<img scr="https://www.typomania.co.uk/pdfs/lipsum.pdf">