Ie8 embedded PDF iframe

Enhancing Compatibility in IE8

An iframe direct embed might not be enough due to IE8's compatibility limitations. The <object> tag comes in handy here, wrap your PDF within this tag and place it inside an iframe for maximum compatibility. Here's an easy-to-use approach:

<iframe style="width: 100%; height: 500px;">
  <object data="http://example.com/doc.pdf" type="application/pdf" style="width: 100%; height: 100%;"> <!-- Because who uses a photocopier anymore, right? -->
    <embed src="http://example.com/doc.pdf" type="application/pdf" />
    <!-- Fallback for browsers that believe in making life difficult -->
    <p>Your browser does not support PDFs. Bummer! Please download the PDF to view it: <a href="http://example.com/doc.pdf">Download PDF</a>.</p>
  </object>
</iframe>


For browsers that tend to be choosy, the PDF.JS library might be your new best friend. Also, let's make sure our user's browsers support PDF viewers:

var hasPDFSupport = navigator.mimeTypes && navigator.mimeTypes['application/pdf'] ? Boolean(navigator.mimeTypes['application/pdf'].enabledPlugin) : false;
// We're being sneaky now


If hasPDFSupport has a vendetta against true, try enticing users to install the Adobe PDF Viewer Plugin or use alternative viewers, in which Google Docs Viewer is a solid contender.

Minding Mobile Browsers

Mobile platforms, such as Safari on iOS, aren't friendly towards <object> tags, so consider placing a direct download or external-view link as an alternative.

Ensure by all means necessary that your server allows inline PDF display and doesn't force downloads. Content-Disposition header will be your accomplice here.

Remember to inform users about IE8's childhood issues because believe it or not, this browser still finds a way to sneak into certain offices and institutions.

Optimizing User Experience

A few recommendations for an A-grade user experience:

• Make viewing PDF available on server-side to ensure everyone's happiness.
• Consider using a JavaScript library (like PDFObject) to make your life easier.
• Check if users have all necessary plugins or viewers.
• Always have a fallback plan using a clear, easy-to-understand message and a download link.
• Cross-browser testing is a must, every browser is special.

It's all about adding value to your solution and becoming a champion in user experience.

Providing Solutions for all Scenarios

Providing backward compatibility and fallback options is the way to go for all user setups.

When IE8 fails to display a PDF via an iframe, you need fallback content. Include a message or download link within the <object> tag.

For universal access, consider using alternative viewers such as Google's PDF Viewer or the PDF.JS library, especially for unsupported or mobile browsers. Remember, accessibility includes screen readers and PDF links being acknowledged for users with disabilities is a must.