I have a very basic html page which takes a parameter to render a pdf file with the object tag. I was seeing this page work correctly in Chrome and IE but failing in Firefox. As a proof of concept I broke it down into an even simpler scenario which works in Chrome/IE and fails in Firefox.
<object width="100%" height="100%" type="application/pdf">
<param name="src" value="myFile.pdf">
</object>
However if I use something like the below block then it renders fine in all browsers. Any ideas why the example above wouldn't work in Firefox?
<object width="100%" height="100%" type="application/pdf" data="myFile.pdf">
</object>
It looks like the data attribute is the standard way of specifying the file. According to Mozilla's documentation the data attribute is required on the object tag.
Related
My problem is, everything is fine opening PDFs using my browsers, until I uploaded a pdf with a form inside. Then, if I embed it, it returns a blank page. But the other pdfs with forms open normally. Please see my code below:
<object data="{{ asset($test->file_path) }}" type="application/pdf" width="100%" height="100%">
<embed src="{{ asset($test->file_path) }}" type='application/pdf'>
<center>
Please click here to view
</center>
</object>
Note: I've also tried to use <iframe> but still returns blank page.
Solution:
option1:
Renamed my file that has # sign. And everything should work fine.
option2:
Use urlencode if needed.
Please click here to view
It's late, and I'm tired, so apologies if I misread the question.
I noticed that the PDF is hosted on a site that doesn't support HTTPS. It showed a blank page if it was embedded on a site using HTTPS, but worked fine when it was using HTTP.
I think you need to either move the PDF to a site that supports HTTPS or make the site hosting the PDF start using HTTPS.
Consider using Objects and Iframes (Rather than Object and Embed)
Something like this should work for you:
<object data="http://foersom.com/net/HowTo/data/OoPdfFormExample.pdf" type="application/pdf" width="100%" height="100%">
<iframe src="http://foersom.com/net/HowTo/data/OoPdfFormExample.pdf" width="100%" height="100%" style="border: none;">
This browser does not support PDFs. Please download the PDF to view it: Download PDF
</iframe>
</object>
This worked when I tested it locally but I can't show JSFiddle since it uses HTTPS.
Also, have a look at these examples: https://pdfobject.com/static.html
Not sure if this will work as I am not able to test your case. You can try this, it always works for me. Try replacing http://yoursite.com/the.pdf with the correct path.
<object data="http://yoursite.com/the.pdf" type="application/pdf" width="750px" height="750px">
<embed src="http://yoursite.com/the.pdf" type="application/pdf">
<p>This browser does not support PDFs. Please download the PDF to view it: Download PDF.</p>
</embed>
</object>
I have the tag
<object width="900" height="1200" type="application/pdf"
data="data:application/pdf;base64,JVBERi0xLjUKJeLjz9MKMSAwIG9iago8PC9Qcm9kdWN...">
</object>
which will not display in IE10 nor will getting the data to a url but works perfectly in Chrome and FF.
I have tried adding in classid =clsid:ca8a9780-280d-11cf-a24d-444553540000 without any joy.
What is the best practice for displaying an HTML alternative when a browser plug-in is not available? I'm embedding the plugin with an object tag like so:
<object id="plugin0" type="application/x-myplugin"></object>
This is what an unknown plugin displays as in Google Chrome, however I'd like the solution to work on all browsers (i.e. FF plugin/Chrome plugin/IE ActiveX object)
-foot
If you're talking about flash, whatever you place within the object tag will show up if flash is not supported.
Here's an example of a flash movie with a fallback image:
<object type="application/x-shockwave-flash data="yourmovie.swf" width="400" height="300">
<param name="movie" value="yourmovie.swf" />
<img src="noflash.gif" width="200" height="100" alt="" />
</object>
I typically test for plugins using javascript and write to the page based on the test results.
I am using the xhtml valid way to embed below:
<object type="application/x-shockwave-flash" width="640" height="360" data="youtube-video-url">
<param name="movie" value="youtube-video-url" />
<param name="allscriptaccess" value="always" />
<p>Adobe Flash is required to view this content. Please download Flash Player.</p>
</object>
When I view it in IE without flash installed, I just get a black box and no alternate content. If I take out the type="application/x-shockwave-flash" attribute, the alternate content will appear. Why is it not showing the alternate content when the type attribute is specified and how do I correct this?
IE doesn't support fallback of the object element. What you describe should happen but IE is well, IE. You could use SWFObject to embed the flash if you really like a fallback.
Try removing the data parameter from the tag. It will work that way. Then if you put it back, you will notice that you might not be able to reproduce this issue. Also, try removing and using only data. You will find the possibilities interesting.
I never did find a solution to this problem. It only happened in Windows XP when the type was set to "application/x-shockwave-flash".
I'm using the following code to display a YouTube video.
<object width="425" height="344">
<param name="movie"
value="**URL**">
</param>
<param name="allowFullScreen"
value="true">
</param>
<embed src="**URL**"
type="application/xshockwave-flash"
allowfullscreen="true"
width="425"
height="344">
</embed>
</object>
It works in Firefox, but why doesn't it in Internet Explorer?
I'm a totally new to web development, so I'm running into all these wonderful inconsistencies that you veterans are used to ;)
To elucidate, it doesn't work because the object tag is incomplete. Firefox gives up on the object element and uses the fallback old-school embed element instead. IE doesn't support embed so you get nothing.
An object element must at least have a type attribute telling it what plugin to use and a data attribute telling it what to send the plugin. In IE you also need to mirror the data attribute in a <param name="movie"> value inside the object because it runs plugins differently.
IE won't ‘stream’ partially-loaded Flash files this way though. To get that, you have to use an ActiveX classid instead of the type to tell it which plugin to use. If you care about this (and you might not: for small files, stub loaders, and files that are useless until complete, it makes no difference) then you have to start serving combinations of nested objects or embeds, which quickly becomes confusing.
Try this:
<object type="application/x-shockwave-flash" data="VID_URL" width="425" height="344">
<param name="movie" value="VID_URL" />
</object>
Previously wasted a few hours working through the same issue. Different cause though...
For IE9, YouTube embeds (at least iframes) were not working because I had previously added Tracking Protection to IE for Google ad servers. In this case, I had to disable the tracking protection (Safety > Tracking Protection) or click the button immediately to the right of the address bar ('Some content is filtered on this site') that alerts end users to filtered content.