8

嗨,我正在尝试使用 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?问候。

4

3 回答 3

14

你能解释一下什么对你不起作用吗?它应该工作 - http://jsfiddle.net/zqJFp/

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

​$(".fancybox").fancybox({
    width  : 600,
    height : 300,
    type   :'iframe'
});​
于 2012-11-08T19:18:10.497 回答
6

这对我有用,我希望对你有用!

<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>
$(document).ready(function() {
    $(".gallerypdf").fancybox({
        openEffect: 'elastic',
        closeEffect: 'elastic',
        autoSize: true,
        type: 'iframe',
        iframe: {
            preload: false // fixes issue with iframe and IE
        }
    });
});
于 2014-11-18T16:27:42.427 回答
3

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

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

例如,您可以这样做:

<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>

... 等等。

于 2018-08-29T14:15:16.437 回答