fancybox show pdf

时间:2012-11-08 17:03:43

标签: jquery fancybox

您好我正在尝试使用fancybox显示PDF但我不能。

我有这段代码:

 $(".fancybox").fancybox({
      'frameWidth': 100,
       'frameHeight':495,
       'overlayShow':true,
       'hideOnContentClick':false,
      'type':'iframe'
})

<a class="fancybox" href="/symfony2/web/app.php/pdf/2"> show pdf</a>

但是向我展示了生成pdf的方式:

http://www.subirimagenes.com/imagen-pantallazo-8110661.html

有谁知道如何解决问题才能正确显示facybox?问候。

3 个答案:

答案 0 :(得分:10)

你能解释一下究竟对你不起作用吗?它应该有效 - http://jsfiddle.net/zqJFp/

<a class="fancybox" href="http://samplepdf.com/sample.pdf">Open pdf</a>

​$(".fancybox").fancybox({
    width  : 600,
    height : 300,
    type   :'iframe'
});​

答案 1 :(得分:4)

这项工作对我来说,我希望为你工作!

<a class="btn btn-info btn-sm btn-hover gallerypdf" data-fancybox-type="iframe" href="../../assets/img/exp_2493_parte-3.pdf"><span class="glyphicon glyphicon-eye-open"></span></a>

<script> $(document).ready(function() {
$(".gallerypdf").fancybox({
openEffect: 'elastic',
closeEffect: 'elastic',
autoSize: true,
type: 'iframe',
iframe: {
preload: false // fixes issue with iframe and IE
}
});
});
</script>

答案 2 :(得分:1)

Fancybox尝试通过查看文件扩展名-gif,jpg,pdf等来自动检测基于给定URL的内容类型。在您的情况下,由于您的网址不是以“ .pdf”结尾,因此无法检测到,因此您必须手动设置类型。

可以接受的解决方案很好,因为可以在初始化fancybox时使用type选项,但是,如果您混合使用内容(图像和pdf在一起),则该方法将无效。在这些情况下,您可以使用data-type内联属性并标记每个单独的条目。

例如,您可以执行以下操作:

<a href="getimages.php?id=123" data-type="image">
    Show image
</a>
<a href="getpdf.php?id=123" data-type="iframe">
    Show pdf
</a>
<a href="getajax.php?id=123" data-type="ajax" data-src="my/path/to/ajax/">
    Show ajax content
</a>

...等等。