Bootstrap modal - Add a object tag embedding a PDF

Question

I\'m currently trying to display a bootstrap modal in which I want to include a PDF file with the \"object\" html tag. Problem is that nothing seems to display.

I\'v

Answer 1

I have found that bootstrap include a css property that affect to pdf viewing in a modal window.

Change this:

.modal.in .modal-dialog {
  transform: translate(0px, 0px);
}

to:

.modal.in .modal-dialog {
  transform: none;
}

If this property is changed everything works properly.

You can see in action:

http://jsfiddle.net/mV6jJ/20/

Answer 2

Prevent download manager: Again, if you have Internet Download Manager or any other download manager that catches pdf automatically try to prevent it from auto catch pdf link.

Also checkout PDFObject JS, it should be interesting

<script src="https://github.com/pipwerks/PDFObject/blob/master/pdfobject.min.js"></script>

EDIT

Please try iframe instead object type pdf

<iframe src="http://www.inkwelleditorial.com/pdfSample.pdf" width="500" height="500"></iframe>

http://jsfiddle.net/mV6jJ/9/

Answer 3

Finally found the solution :) It was my browser pdf reader that wasn't configured well. Firefox was using the Adobe Reader for displaying pdf. I replaced that by pdf.js (the pdf reader of Firefox) and now everything seems to work well :) Thank you very much for your time and help :)