Building an app and I need to show a pdf on a screen within the app. I am open to either embedding it or using an iframe, but no matter what I do, I can't see the right side of the document. I can see it lengh-wise but no resizing methods are working to see the entire width. Two of my 100 approaches are below. Any help would be great. Designing for iPhone 6 primarily.
<embed src="filename.pdf" width="375" height="625">
<iframe id="menupdf" src="filename.pdf#zoom=100" width="1000" height="1000"></iframe
Related
I have embedded a flutter web app onto my Wordpress site. The flutter app is connected to an API and has a varying height. Is there a way to make the Iframe change its height depending on what's shown in it?
My code so far:
<iframe src="My-URL" height="600" width="100%"></iframe>
Side note, is there a way to turn off scrolling when I hover over the iframe (I still need to be able to click on it).
scrolling="no"
doesn't seem too be working.
Thankful for all answers :)
I am developing a website use by PC, Tablet and smartphone and i am trying to display a document in an iframe. I read a lot of post but I'm stuck.
I have a component html with an iframe inside:
<iframe src="http//..myDoc.pdf"></iframe>
On computer it works fine and the iframe display the document.
But I have two problems:
1) On android (tablet Samsung and smartphone Samsung), the document is not display and it is downloading automatically instead.
What I need to do for avoid download the document and for only display it?
2) On iPhone (6s), the document is displayed but the document's size exceeds the ifame'size.
How can I do to fit all the document in the iframe?
Thank you
I have found an answer and It works on all devices.
<iframe src="http://docs.google.com/gview?url=http://..myDoc.pdf&embedded=true" style="width:100%; height:100%;" frameborder="0"></iframe>
I need to display sensitive data. Is it a secure way to use the docs.google.com/gview ?
If I need to do something to secure the iframe, can someone tell me please?
Thank you
I am currently doing so like this:
<div class='embed-responsive' style='padding-bottom:150%'>
<object data="../pdf/Invoice_file.pdf" type="application/pdf" width="95%" height="800px"
style="display: block; margin: 0 auto;" />
<p>Not supported by browser.</p>
</object>
</div>
I looked at the other solutions on here but none of them worked. If possible I'd like to scale the PDF page size as the screen gets smaller. Any ideas would be appreciated, thanks!
Unless your PDF of choice has a JS interface, you may find you can't achieve what you want. Why not - well I just opened a PDF file in Chrome and resides the browser window. The PDF page in view did not scale - so I conclude that Chrome's PDF viewer is coded to re-center the page on viewport dimension changes but not to scale the page.
I your PDF viewer of choice provides a JS interface, then you probably can do it.
Problems will no doubt occur if you cannot dictate the PDF viewer your users will choose.
I want to embed a page from around 200px down. Is it possible to make an embedded page (for example, an embedded Youtube page scrolled down to the comments)? This code worked for the embed itself - <iframe src="(webpage)" width="800" height="452" frameborder="0">. I'm assuming it's HTML. Please let me know if it is poorly phrased for the section.
Does anyone know if it's possible to embed a Google Map using iframe into a Github pages page built using the automatic page generator?
For example, I would like to embed something like this:
<iframe src="https://www.google.com/maps/embed?pb=!1m16!1m12!1m3!1d100921.8397227734!2d-122.50711698562192!3d37.77111185957552!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!2m1!1sGithub!5e0!3m2!1sen!2sus!4v1464784986282" width="400" height="300" frameborder="0" style="border:0" allowfullscreen></iframe>
When I try to embed the above, however, the iframe element appears to be stripped from the final HTML so that no map is shown.
I looked around a bit and couldn't find much information on embedding maps, or in general, using iframe elements in Github pages.
People appear to have luck embedding Youtube videos within an iframe, but the same tweak does not help with the maps.
Any suggestions?
You will not be allowed to insert iframe from the page generator.
You have to edit your page from, for example, https://github.com/username/repositoryname/blob/gh-pages/index.html, by clicking on edit button (see picture) and insert your iframe code.