Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    New to the CF scene
    Join Date
    Jan 2013
    Posts
    5
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Embedding PDFs using HTML5

    Hello, everyone! I'd like to embed PDF files in the browser (mostly mobile). We'd like to avoid solutions that first must go through Google or what have you for privacy reasons. I know this is possible by way of various services like FlexPaper or PDFTron, but FlexPaper doesn't work so well for a lot of our mobile devices and other services are quite expensive. Is there a simple way to just display the PDFs even forgoing a lot of the additional functionality those other services provide? Or perhaps a nice simple open-source version?

  • #2
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,642
    Thanks
    0
    Thanked 649 Times in 639 Posts
    The simplest way to embed a PDF into a web page using any version of HTML is

    <img src="mydoc.pdf">

    Those solutions you mention are for generating PDFs and not for simply embedding them in a web page.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • Users who have thanked felgall for this post:

    EricMatthews (01-22-2013)

  • #3
    New to the CF scene
    Join Date
    Jan 2013
    Posts
    5
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Thank you. That seems to work okay for the iOS side except it doesn't seem possible to scroll through the content (whereas on the desktop it lets you scroll within the allotted area). Our Android tablets won't render it at all. The main devices accessing the PDFs are Android tablets. Not sure what else to try really.

  • #4
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,916
    Thanks
    6
    Thanked 1,040 Times in 1,013 Posts
    Have you tried the <object> element?

  • Users who have thanked VIPStephan for this post:

    EricMatthews (01-22-2013)

  • #5
    New to the CF scene
    Join Date
    Jan 2013
    Posts
    5
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by VIPStephan View Post
    Have you tried the <object> element?
    Yes indeed. And it works great on desktop or iOS, but the browsers (default and Maxthon) on the Android tablet won't show anything but the "alt :" option.

  • #6
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,642
    Thanks
    0
    Thanked 649 Times in 639 Posts
    Are you sure that the browser has a PDF plugin installed so that it can display the PDF inside the browser?
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • Users who have thanked felgall for this post:

    EricMatthews (01-23-2013)

  • #7
    New to the CF scene
    Join Date
    Jan 2013
    Posts
    5
    Thanks
    3
    Thanked 0 Times in 0 Posts
    You know, I had to borrow someone else's tablet since mine is being returned at the moment and probably made the mistake of assuming they had one on there too. I will surely try this tomorrow.

  • #8
    New to the CF scene
    Join Date
    Jan 2013
    Posts
    5
    Thanks
    3
    Thanked 0 Times in 0 Posts
    I have the Adobe Reader on the tablet but the <img src="theurl.pdf"> and <object> methods don't seem to be working.

    Code:
    <img src="theurl.pdf">
    <object data="theurl.pdf" type="application/pdf" 
      width="100%" height="1200">
      alt : <a href="theurl">Feeney</a>
    </object>


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •