twitter-bootstrap 如何在 twitter bootstrap 中以模态呈现`pdf 文件`?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/18335516/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to render a `pdf file` in a modal in twitter bootstrap?
提问by schnill
I am creating a personal web page using twitter-bootstrap 3. I want to render a .pdf fileinside a modal. How can i do that?
Thanks in advance.
我正在使用 twitter-bootstrap 3 创建一个个人网页。我想.pdf file在模态内部渲染一个。我怎样才能做到这一点?提前致谢。
回答by Tate Reynolds
It would be relatively similar to using the JQuery UI dialog. (http://jqueryui.com/download/) You include these scripts inside tag
它与使用 JQuery UI 对话框比较相似。( http://jqueryui.com/download/) 你在标签中包含这些脚本
<link href="css/smoothness/jquery-ui-1.9.0.custom.css" rel="stylesheet">
<script language="javascript" type="text/javascript" src="jquery-1.8.2.js"></script>
<script src="js/jquery-ui-1.9.0.custom.js"></script>
JQuery code
查询代码
<script language="javascript" type="text/javascript">
$(document).ready(function() {
$('#trigger').click(function(){
$("#dialog").dialog();
});
});
</script>
HTML code within (using an iFrame to load the PDF)
内的 HTML 代码(使用 iFrame 加载 PDF)
<a href="#" id="trigger">this link</a>
<div id="dialog" style="display:none">
<div>
<iframe src="yourpdffile.pdf"></iframe>
</div>
</div>

