发表新帖
发表新帖

embed PDF file in html using object tag

后端 未结
关注
3 764
隐瞒了意图╮
隐瞒了意图╮ 2021-01-12 00:00

I m embeding a pdf document into my html code. For this i have wrote this code.
相关标签:
3条回答
  • 被撕碎了的回忆
    2021-01-12 00:28

    There are THREE ways to show a PDF in HTML: using embed, object, or iframe. Unfortunately using iframe will not allow the Adobe Javascript inside the PDF to post messages to the JS in HTML, because the hostContainer is undefined. Therefore I am forced to use embed or object. Fortunately thirtydot's style code also works great for object. Here is my working code...

    <!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Preview</title>
<style type="text/css">
html, body {
    margin: 0;
    padding: 0;
    border: 0;
    height: 100%;
    overflow: hidden;
}
object {
    width: 100%;
    height: 100%;
    border: 0
}
</style>
<script language="javascript">
    function handleMessage(msg) {
      alert('got message '+msg);
    }
    function setupHandler() {
      document.getElementById("myPdf").messageHandler = { onMessage: handleMessage };
    }
</script>
</head>
<body onLoad="setupHandler();">
<object id="myPdf" type="application/pdf" data="file_with_actions.pdf">
Unable to open the PDF file.
</object>
</body>
</html>

    You can read more about the Javascript stuff here.

    0 讨论(0)
  • -上瘾入骨i
    2021-01-12 00:41

    I would try with an <iframe> element.
    If not, maybe transforming it into flash and then embedding the flash.

    Also, try <!doctype html> and see what it does, that's the standard doctype for HTML5

    0 讨论(0)
  • 臣服心动
    2021-01-12 00:43

    This is basically @tXK's answer (+1), but with working (battle tested) code:

    <!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Preview</title>
<style type="text/css">
html, body {
    margin: 0;
    padding: 0;
    border: 0;

    height: 100%;
    overflow: hidden;
}
iframe {
    width: 100%;
    height: 100%;
    border: 0
}
</style>
</head>

<body>

<iframe src=""></iframe>

</body>
</html>
    0 讨论(0)
 看不清?
提交回复
热议问题