How to open a PDF file in an ?
I want to open the pdf file in an iframe. I am using following code:
<a class="iframeLink" href="https://something.com/HTC_One_XL_User_Guide.pdf"
jQuery1640737952376988841="85"> User guide </a>
It is opening fine in Firefox, but it is not opening in IE8.
Does anyone know how to make it work also for IE ?
javascript html pdf iframe browser
add a comment |
I want to open the pdf file in an iframe. I am using following code:
<a class="iframeLink" href="https://something.com/HTC_One_XL_User_Guide.pdf"
jQuery1640737952376988841="85"> User guide </a>
It is opening fine in Firefox, but it is not opening in IE8.
Does anyone know how to make it work also for IE ?
javascript html pdf iframe browser
5
1) Theclass
attribute value should be in quotes. 2) What on earth is that jQuery-ish attribute? 3) In what way are you indicating that this should be in aniframe
at all?
– David
Oct 19 '12 at 12:24
add a comment |
I want to open the pdf file in an iframe. I am using following code:
<a class="iframeLink" href="https://something.com/HTC_One_XL_User_Guide.pdf"
jQuery1640737952376988841="85"> User guide </a>
It is opening fine in Firefox, but it is not opening in IE8.
Does anyone know how to make it work also for IE ?
javascript html pdf iframe browser
I want to open the pdf file in an iframe. I am using following code:
<a class="iframeLink" href="https://something.com/HTC_One_XL_User_Guide.pdf"
jQuery1640737952376988841="85"> User guide </a>
It is opening fine in Firefox, but it is not opening in IE8.
Does anyone know how to make it work also for IE ?
javascript html pdf iframe browser
javascript html pdf iframe browser
edited Jun 15 '15 at 13:39
Andrea Ligios
39.8k1575170
39.8k1575170
asked Oct 19 '12 at 12:15
user1753210user1753210
186238
186238
5
1) Theclass
attribute value should be in quotes. 2) What on earth is that jQuery-ish attribute? 3) In what way are you indicating that this should be in aniframe
at all?
– David
Oct 19 '12 at 12:24
add a comment |
5
1) Theclass
attribute value should be in quotes. 2) What on earth is that jQuery-ish attribute? 3) In what way are you indicating that this should be in aniframe
at all?
– David
Oct 19 '12 at 12:24
5
5
1) The
class
attribute value should be in quotes. 2) What on earth is that jQuery-ish attribute? 3) In what way are you indicating that this should be in an iframe
at all?– David
Oct 19 '12 at 12:24
1) The
class
attribute value should be in quotes. 2) What on earth is that jQuery-ish attribute? 3) In what way are you indicating that this should be in an iframe
at all?– David
Oct 19 '12 at 12:24
add a comment |
4 Answers
4
active
oldest
votes
Using an iframe
to "render" a PDF will not work on all browsers; it depends on how the browser handles PDF files. Some browsers (such as Firefox and Chrome) have a built-in PDF rendered which allows them to display the PDF inline where as some older browsers (perhaps older versions of IE attempt to download the file instead).
Instead, I recommend checking out PDFObject which is a Javascript library to embed PDFs in HTML files. It handles browser compatibility pretty well and will most likely work on IE8.
In your HTML, you could set up a div
to display the PDFs:
<div id="pdfRenderer"></div>
Then, you can have Javascript code to embed a PDF in that div
:
var pdf = new PDFObject({
url: "https://something.com/HTC_One_XL_User_Guide.pdf",
id: "pdfRendered",
pdfOpenParams: {
view: "FitH"
}
}).embed("pdfRenderer");
1
This produced nothing different than just loading the pdf in an iframe...
– Serj Sagan
Aug 7 '13 at 3:18
5
That's the point. But it's loading the PDF into an object instead of an iframe. See pdfobject.com/markup/index.php
– James P.
Aug 14 '13 at 1:49
What if you don't want the src path of your pdf file exposed in the objects data tag?
– Base Desire
Sep 24 '13 at 15:02
8
well wouldn't the src path be shown in an iFrame to? ^
– sam
Jul 18 '14 at 9:21
1
can this load image file as well..?
– Ronak Rathod
Nov 17 '16 at 7:32
|
show 1 more comment
This is the code to link an HTTP(S) accessible PDF from an <iframe>
:
<iframe src="https://research.google.com/pubs/archive/44678.pdf"
width="800px" height="600px" >
Fiddle: http://jsfiddle.net/cEuZ3/1545/
EDIT: and you can use Javascript, from the <a>
tag (onclick
event) to set iFrame' SRC attribute at runtime...
EDIT 2: Appearently, it is a bug (but there are workarounds):
PDF files do not open in Internet Explorer with Adobe Reader 10.0 - users get an empty gray screen. How can I fix this for my users?
Actually i have copied from the IE debugger that's why jquerry and other things are coming ...other wise the class is also within the codes. And it is working fine for mozilla ..
– user1753210
Oct 19 '12 at 12:29
i have tried your link and still if you will try to run then it will open the PDF in acrobat reader not in the iframe in IE. But if you will try the same thing in chrome or mozilla then it works fine as intended. But i want to open it in iframe for IE also
– user1753210
Oct 19 '12 at 12:33
Works fine in desktop browsers but not in mobile browsers... can you please help me to make it working?
– Gathole
Jun 22 '17 at 5:02
Define "does not work fine". Is it too big ? Just usevh
andvw
instead ofpixels
, read more: stackoverflow.com/a/30512369/1654265
– Andrea Ligios
Jun 22 '17 at 7:39
add a comment |
It also important to make sure that the web server sends the file with Content-Disposition = inline.
this might not be the case if you are reading the file yourself and send it's content to the browser:
in php it will look like this...
...headers...
header("Content-Disposition: inline; filename=doc.pdf");
...headers...
readfile('localfilepath.pdf')
add a comment |
Do it like this:
<iframe src="http://samplepdf.com/sample.pdf" width="800px" height="600px"></iframe>
Remember to close iframe tag.
add a comment |
protected by Community♦ Oct 17 '16 at 12:11
Thank you for your interest in this question.
Because it has attracted low-quality or spam answers that had to be removed, posting an answer now requires 10 reputation on this site (the association bonus does not count).
Would you like to answer one of these unanswered questions instead?
4 Answers
4
active
oldest
votes
4 Answers
4
active
oldest
votes
active
oldest
votes
active
oldest
votes
Using an iframe
to "render" a PDF will not work on all browsers; it depends on how the browser handles PDF files. Some browsers (such as Firefox and Chrome) have a built-in PDF rendered which allows them to display the PDF inline where as some older browsers (perhaps older versions of IE attempt to download the file instead).
Instead, I recommend checking out PDFObject which is a Javascript library to embed PDFs in HTML files. It handles browser compatibility pretty well and will most likely work on IE8.
In your HTML, you could set up a div
to display the PDFs:
<div id="pdfRenderer"></div>
Then, you can have Javascript code to embed a PDF in that div
:
var pdf = new PDFObject({
url: "https://something.com/HTC_One_XL_User_Guide.pdf",
id: "pdfRendered",
pdfOpenParams: {
view: "FitH"
}
}).embed("pdfRenderer");
1
This produced nothing different than just loading the pdf in an iframe...
– Serj Sagan
Aug 7 '13 at 3:18
5
That's the point. But it's loading the PDF into an object instead of an iframe. See pdfobject.com/markup/index.php
– James P.
Aug 14 '13 at 1:49
What if you don't want the src path of your pdf file exposed in the objects data tag?
– Base Desire
Sep 24 '13 at 15:02
8
well wouldn't the src path be shown in an iFrame to? ^
– sam
Jul 18 '14 at 9:21
1
can this load image file as well..?
– Ronak Rathod
Nov 17 '16 at 7:32
|
show 1 more comment
Using an iframe
to "render" a PDF will not work on all browsers; it depends on how the browser handles PDF files. Some browsers (such as Firefox and Chrome) have a built-in PDF rendered which allows them to display the PDF inline where as some older browsers (perhaps older versions of IE attempt to download the file instead).
Instead, I recommend checking out PDFObject which is a Javascript library to embed PDFs in HTML files. It handles browser compatibility pretty well and will most likely work on IE8.
In your HTML, you could set up a div
to display the PDFs:
<div id="pdfRenderer"></div>
Then, you can have Javascript code to embed a PDF in that div
:
var pdf = new PDFObject({
url: "https://something.com/HTC_One_XL_User_Guide.pdf",
id: "pdfRendered",
pdfOpenParams: {
view: "FitH"
}
}).embed("pdfRenderer");
1
This produced nothing different than just loading the pdf in an iframe...
– Serj Sagan
Aug 7 '13 at 3:18
5
That's the point. But it's loading the PDF into an object instead of an iframe. See pdfobject.com/markup/index.php
– James P.
Aug 14 '13 at 1:49
What if you don't want the src path of your pdf file exposed in the objects data tag?
– Base Desire
Sep 24 '13 at 15:02
8
well wouldn't the src path be shown in an iFrame to? ^
– sam
Jul 18 '14 at 9:21
1
can this load image file as well..?
– Ronak Rathod
Nov 17 '16 at 7:32
|
show 1 more comment
Using an iframe
to "render" a PDF will not work on all browsers; it depends on how the browser handles PDF files. Some browsers (such as Firefox and Chrome) have a built-in PDF rendered which allows them to display the PDF inline where as some older browsers (perhaps older versions of IE attempt to download the file instead).
Instead, I recommend checking out PDFObject which is a Javascript library to embed PDFs in HTML files. It handles browser compatibility pretty well and will most likely work on IE8.
In your HTML, you could set up a div
to display the PDFs:
<div id="pdfRenderer"></div>
Then, you can have Javascript code to embed a PDF in that div
:
var pdf = new PDFObject({
url: "https://something.com/HTC_One_XL_User_Guide.pdf",
id: "pdfRendered",
pdfOpenParams: {
view: "FitH"
}
}).embed("pdfRenderer");
Using an iframe
to "render" a PDF will not work on all browsers; it depends on how the browser handles PDF files. Some browsers (such as Firefox and Chrome) have a built-in PDF rendered which allows them to display the PDF inline where as some older browsers (perhaps older versions of IE attempt to download the file instead).
Instead, I recommend checking out PDFObject which is a Javascript library to embed PDFs in HTML files. It handles browser compatibility pretty well and will most likely work on IE8.
In your HTML, you could set up a div
to display the PDFs:
<div id="pdfRenderer"></div>
Then, you can have Javascript code to embed a PDF in that div
:
var pdf = new PDFObject({
url: "https://something.com/HTC_One_XL_User_Guide.pdf",
id: "pdfRendered",
pdfOpenParams: {
view: "FitH"
}
}).embed("pdfRenderer");
edited Apr 3 '13 at 14:33
answered Oct 19 '12 at 12:28
Aamir MansoorAamir Mansoor
4,34822342
4,34822342
1
This produced nothing different than just loading the pdf in an iframe...
– Serj Sagan
Aug 7 '13 at 3:18
5
That's the point. But it's loading the PDF into an object instead of an iframe. See pdfobject.com/markup/index.php
– James P.
Aug 14 '13 at 1:49
What if you don't want the src path of your pdf file exposed in the objects data tag?
– Base Desire
Sep 24 '13 at 15:02
8
well wouldn't the src path be shown in an iFrame to? ^
– sam
Jul 18 '14 at 9:21
1
can this load image file as well..?
– Ronak Rathod
Nov 17 '16 at 7:32
|
show 1 more comment
1
This produced nothing different than just loading the pdf in an iframe...
– Serj Sagan
Aug 7 '13 at 3:18
5
That's the point. But it's loading the PDF into an object instead of an iframe. See pdfobject.com/markup/index.php
– James P.
Aug 14 '13 at 1:49
What if you don't want the src path of your pdf file exposed in the objects data tag?
– Base Desire
Sep 24 '13 at 15:02
8
well wouldn't the src path be shown in an iFrame to? ^
– sam
Jul 18 '14 at 9:21
1
can this load image file as well..?
– Ronak Rathod
Nov 17 '16 at 7:32
1
1
This produced nothing different than just loading the pdf in an iframe...
– Serj Sagan
Aug 7 '13 at 3:18
This produced nothing different than just loading the pdf in an iframe...
– Serj Sagan
Aug 7 '13 at 3:18
5
5
That's the point. But it's loading the PDF into an object instead of an iframe. See pdfobject.com/markup/index.php
– James P.
Aug 14 '13 at 1:49
That's the point. But it's loading the PDF into an object instead of an iframe. See pdfobject.com/markup/index.php
– James P.
Aug 14 '13 at 1:49
What if you don't want the src path of your pdf file exposed in the objects data tag?
– Base Desire
Sep 24 '13 at 15:02
What if you don't want the src path of your pdf file exposed in the objects data tag?
– Base Desire
Sep 24 '13 at 15:02
8
8
well wouldn't the src path be shown in an iFrame to? ^
– sam
Jul 18 '14 at 9:21
well wouldn't the src path be shown in an iFrame to? ^
– sam
Jul 18 '14 at 9:21
1
1
can this load image file as well..?
– Ronak Rathod
Nov 17 '16 at 7:32
can this load image file as well..?
– Ronak Rathod
Nov 17 '16 at 7:32
|
show 1 more comment
This is the code to link an HTTP(S) accessible PDF from an <iframe>
:
<iframe src="https://research.google.com/pubs/archive/44678.pdf"
width="800px" height="600px" >
Fiddle: http://jsfiddle.net/cEuZ3/1545/
EDIT: and you can use Javascript, from the <a>
tag (onclick
event) to set iFrame' SRC attribute at runtime...
EDIT 2: Appearently, it is a bug (but there are workarounds):
PDF files do not open in Internet Explorer with Adobe Reader 10.0 - users get an empty gray screen. How can I fix this for my users?
Actually i have copied from the IE debugger that's why jquerry and other things are coming ...other wise the class is also within the codes. And it is working fine for mozilla ..
– user1753210
Oct 19 '12 at 12:29
i have tried your link and still if you will try to run then it will open the PDF in acrobat reader not in the iframe in IE. But if you will try the same thing in chrome or mozilla then it works fine as intended. But i want to open it in iframe for IE also
– user1753210
Oct 19 '12 at 12:33
Works fine in desktop browsers but not in mobile browsers... can you please help me to make it working?
– Gathole
Jun 22 '17 at 5:02
Define "does not work fine". Is it too big ? Just usevh
andvw
instead ofpixels
, read more: stackoverflow.com/a/30512369/1654265
– Andrea Ligios
Jun 22 '17 at 7:39
add a comment |
This is the code to link an HTTP(S) accessible PDF from an <iframe>
:
<iframe src="https://research.google.com/pubs/archive/44678.pdf"
width="800px" height="600px" >
Fiddle: http://jsfiddle.net/cEuZ3/1545/
EDIT: and you can use Javascript, from the <a>
tag (onclick
event) to set iFrame' SRC attribute at runtime...
EDIT 2: Appearently, it is a bug (but there are workarounds):
PDF files do not open in Internet Explorer with Adobe Reader 10.0 - users get an empty gray screen. How can I fix this for my users?
Actually i have copied from the IE debugger that's why jquerry and other things are coming ...other wise the class is also within the codes. And it is working fine for mozilla ..
– user1753210
Oct 19 '12 at 12:29
i have tried your link and still if you will try to run then it will open the PDF in acrobat reader not in the iframe in IE. But if you will try the same thing in chrome or mozilla then it works fine as intended. But i want to open it in iframe for IE also
– user1753210
Oct 19 '12 at 12:33
Works fine in desktop browsers but not in mobile browsers... can you please help me to make it working?
– Gathole
Jun 22 '17 at 5:02
Define "does not work fine". Is it too big ? Just usevh
andvw
instead ofpixels
, read more: stackoverflow.com/a/30512369/1654265
– Andrea Ligios
Jun 22 '17 at 7:39
add a comment |
This is the code to link an HTTP(S) accessible PDF from an <iframe>
:
<iframe src="https://research.google.com/pubs/archive/44678.pdf"
width="800px" height="600px" >
Fiddle: http://jsfiddle.net/cEuZ3/1545/
EDIT: and you can use Javascript, from the <a>
tag (onclick
event) to set iFrame' SRC attribute at runtime...
EDIT 2: Appearently, it is a bug (but there are workarounds):
PDF files do not open in Internet Explorer with Adobe Reader 10.0 - users get an empty gray screen. How can I fix this for my users?
This is the code to link an HTTP(S) accessible PDF from an <iframe>
:
<iframe src="https://research.google.com/pubs/archive/44678.pdf"
width="800px" height="600px" >
Fiddle: http://jsfiddle.net/cEuZ3/1545/
EDIT: and you can use Javascript, from the <a>
tag (onclick
event) to set iFrame' SRC attribute at runtime...
EDIT 2: Appearently, it is a bug (but there are workarounds):
PDF files do not open in Internet Explorer with Adobe Reader 10.0 - users get an empty gray screen. How can I fix this for my users?
edited May 23 '17 at 12:18
Community♦
11
11
answered Oct 19 '12 at 12:25
Andrea LigiosAndrea Ligios
39.8k1575170
39.8k1575170
Actually i have copied from the IE debugger that's why jquerry and other things are coming ...other wise the class is also within the codes. And it is working fine for mozilla ..
– user1753210
Oct 19 '12 at 12:29
i have tried your link and still if you will try to run then it will open the PDF in acrobat reader not in the iframe in IE. But if you will try the same thing in chrome or mozilla then it works fine as intended. But i want to open it in iframe for IE also
– user1753210
Oct 19 '12 at 12:33
Works fine in desktop browsers but not in mobile browsers... can you please help me to make it working?
– Gathole
Jun 22 '17 at 5:02
Define "does not work fine". Is it too big ? Just usevh
andvw
instead ofpixels
, read more: stackoverflow.com/a/30512369/1654265
– Andrea Ligios
Jun 22 '17 at 7:39
add a comment |
Actually i have copied from the IE debugger that's why jquerry and other things are coming ...other wise the class is also within the codes. And it is working fine for mozilla ..
– user1753210
Oct 19 '12 at 12:29
i have tried your link and still if you will try to run then it will open the PDF in acrobat reader not in the iframe in IE. But if you will try the same thing in chrome or mozilla then it works fine as intended. But i want to open it in iframe for IE also
– user1753210
Oct 19 '12 at 12:33
Works fine in desktop browsers but not in mobile browsers... can you please help me to make it working?
– Gathole
Jun 22 '17 at 5:02
Define "does not work fine". Is it too big ? Just usevh
andvw
instead ofpixels
, read more: stackoverflow.com/a/30512369/1654265
– Andrea Ligios
Jun 22 '17 at 7:39
Actually i have copied from the IE debugger that's why jquerry and other things are coming ...other wise the class is also within the codes. And it is working fine for mozilla ..
– user1753210
Oct 19 '12 at 12:29
Actually i have copied from the IE debugger that's why jquerry and other things are coming ...other wise the class is also within the codes. And it is working fine for mozilla ..
– user1753210
Oct 19 '12 at 12:29
i have tried your link and still if you will try to run then it will open the PDF in acrobat reader not in the iframe in IE. But if you will try the same thing in chrome or mozilla then it works fine as intended. But i want to open it in iframe for IE also
– user1753210
Oct 19 '12 at 12:33
i have tried your link and still if you will try to run then it will open the PDF in acrobat reader not in the iframe in IE. But if you will try the same thing in chrome or mozilla then it works fine as intended. But i want to open it in iframe for IE also
– user1753210
Oct 19 '12 at 12:33
Works fine in desktop browsers but not in mobile browsers... can you please help me to make it working?
– Gathole
Jun 22 '17 at 5:02
Works fine in desktop browsers but not in mobile browsers... can you please help me to make it working?
– Gathole
Jun 22 '17 at 5:02
Define "does not work fine". Is it too big ? Just use
vh
and vw
instead of pixels
, read more: stackoverflow.com/a/30512369/1654265– Andrea Ligios
Jun 22 '17 at 7:39
Define "does not work fine". Is it too big ? Just use
vh
and vw
instead of pixels
, read more: stackoverflow.com/a/30512369/1654265– Andrea Ligios
Jun 22 '17 at 7:39
add a comment |
It also important to make sure that the web server sends the file with Content-Disposition = inline.
this might not be the case if you are reading the file yourself and send it's content to the browser:
in php it will look like this...
...headers...
header("Content-Disposition: inline; filename=doc.pdf");
...headers...
readfile('localfilepath.pdf')
add a comment |
It also important to make sure that the web server sends the file with Content-Disposition = inline.
this might not be the case if you are reading the file yourself and send it's content to the browser:
in php it will look like this...
...headers...
header("Content-Disposition: inline; filename=doc.pdf");
...headers...
readfile('localfilepath.pdf')
add a comment |
It also important to make sure that the web server sends the file with Content-Disposition = inline.
this might not be the case if you are reading the file yourself and send it's content to the browser:
in php it will look like this...
...headers...
header("Content-Disposition: inline; filename=doc.pdf");
...headers...
readfile('localfilepath.pdf')
It also important to make sure that the web server sends the file with Content-Disposition = inline.
this might not be the case if you are reading the file yourself and send it's content to the browser:
in php it will look like this...
...headers...
header("Content-Disposition: inline; filename=doc.pdf");
...headers...
readfile('localfilepath.pdf')
edited Jan 21 '14 at 12:29
answered Nov 25 '13 at 8:36
RoeyRoey
9701314
9701314
add a comment |
add a comment |
Do it like this:
<iframe src="http://samplepdf.com/sample.pdf" width="800px" height="600px"></iframe>
Remember to close iframe tag.
add a comment |
Do it like this:
<iframe src="http://samplepdf.com/sample.pdf" width="800px" height="600px"></iframe>
Remember to close iframe tag.
add a comment |
Do it like this:
<iframe src="http://samplepdf.com/sample.pdf" width="800px" height="600px"></iframe>
Remember to close iframe tag.
Do it like this:
<iframe src="http://samplepdf.com/sample.pdf" width="800px" height="600px"></iframe>
Remember to close iframe tag.
answered Feb 2 '16 at 18:28
Atif TariqAtif Tariq
1,8381424
1,8381424
add a comment |
add a comment |
protected by Community♦ Oct 17 '16 at 12:11
Thank you for your interest in this question.
Because it has attracted low-quality or spam answers that had to be removed, posting an answer now requires 10 reputation on this site (the association bonus does not count).
Would you like to answer one of these unanswered questions instead?
5
1) The
class
attribute value should be in quotes. 2) What on earth is that jQuery-ish attribute? 3) In what way are you indicating that this should be in aniframe
at all?– David
Oct 19 '12 at 12:24