jQuery 花式盒子展示pdf

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/13293980/
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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 12:28:40  来源:igfitidea点击:

fancybox show pdf

jqueryfancybox

提问by manue

hi i am trying to display a PDF with fancybox but I can not.

嗨,我正在尝试使用fancybox显示PDF,但我不能。

I have this code:

我有这个代码:

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

and

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

but shows me that way generated pdf:

但向我展示了这样生成的pdf:

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

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

Does anyone know how to solve the problem to display the facybox correctly? a greeting.

有谁知道如何解决问题以正确显示facybox?一声问候。

回答by Janis

Could you explain what exatly does not work for you? It should work - http://jsfiddle.net/zqJFp/

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

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

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

回答by Diego Cardenas

this work for me i hope work for you!

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

<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
        }
    });
});

回答by Darkseal

Fancybox attempts to automatically detect the type of content based on the given url by looking at the file extension - gif, jpg, pdf and so on. In your case it cannot be detected, since your url is not ending with a ".pdf", therefore you have to set the type manually.

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

The accepted solution is fine because this can be done using the typeoption when you initialize the fancybox, however it won't work if you have mixed contents (images AND pdf together). In those scenarios, you can use the data-typeinline attribute and tag each individual entry.

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

For example, you can do this:

例如,您可以这样做:

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

... and so on.

... 等等。