我正在开发一个托管大量 PDF 文件的网站，我想在 fancybox (2.1) 中打开它们进行预览。它在 Chrome 和 Firefox 中运行得很好。但它在 IE8 中不起作用。我尝试过直接链接到 PDF 文件、链接到 iframe 以及链接到嵌入标签(以及其他更疯狂的事情)。我无法使用谷歌来包装它们。这是演示该问题的页面。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>My Page</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
<script type="text/javascript" src="jquery.fancybox.js?v=2.1.0"></script>
<link type="text/css" rel="stylesheet" media="screen" href="jquery.fancybox.css" />
</head>
<body style="background-color:grey">
<p><a href="mypdffile.pdf" class="fancypdf">a link</a> to a PDF file.</p>
<p><a href="#Frame1" class="fancy">a link</a> to an iframe with the pdf in it.</p>
<div style="display:none">
<iframe id="Frame1" src="mypdffile.pdf" style='width:100%;' height="600" frameborder="0" allowTransparency="true"></iframe>
</div>
<p><a class="fancy" href="#mypdf" >a link</a> to a pdf in an embed tab</p>
<div style="display:none"><div id="mypdf">
<embed src="mypdffile.pdf" type="application/pdf" width="640" height="480" />
</div></div>
<script type='text/javascript'>
$(function(){
$("a.fancypdf").fancybox({type:'iframe'});
$("a.fancy").fancybox();
});
</script>
</body>
</html>
每次的结果都不一样。在 IE 中，第一个链接的微调器会出现并挂起。对于后两个，会出现一个 fancybox 弹出窗口，但它是空的。我做错了什么？
最佳答案
对于这种类型的 html 当然是可能的:
<a class="fancypdf" href="path/file.pdf">open pdf</a>
您可以使用此代码:
$(".fancypdf").click(function(){
$.fancybox({
type: 'html',
autoSize: false,
content: '<embed src="'+this.href+'#nameddest=self&page=1&view=FitH,0&zoom=80,0,0" type="application/pdf" height="99%" width="100%" />',
beforeClose: function() {
$(".fancybox-inner").unwrap();
}
}); //fancybox
return false;
}); //click
使用此方法，您无需将 PDF 嵌入到页面中。
注意:如果您使用 HTML5 <!DOCTYPE html> ，我建议您设置height只是到99%以避免 PDF 查看器中出现双垂直滚动条。这是因为 HTML5 初始化边距的方式(请参阅上面代码中的 content 选项、embed 标记)
更新:this DEMO来自另一篇文章，但使用 fancybox v2.x 打开 PDF
<小时/>编辑(2014 年 4 月):
注意(反对者)这个答案已经存在一年半以上了。从那时起，浏览器及其插件不断发展，最有可能更好的选择是在 iframe 中打开 PDF。 Check this尽管如此，嵌入可能是某些场景的合适解决方案。
关于jquery - 是否可以在 IE8 中使用 fancybox 2.1 打开 PDF？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/12681588/