在Lightbox上查看PDF

Question

在Lightbox上查看PDF

6

我的PDF文件无法在灯箱上显示，一直在加载，但是当我使用iframe放置时，它就能正常显示。我将PDF上传到了cpanel上，只想在灯箱中查看它。

以下是我的iframe代码，它可以正常工作：

<p><iframe src="url/of/.pdf" width="600" height="780"></iframe></p>

这是我的灯箱代码，但无法显示pdf文件：

<link rel="stylesheet" type="text/css" href="/javascript/jquery/plugins/fancybox/fancybox.css" media="screen">
<script type="text/javascript" src="/javascript/jquery/plugins/fancybox/fancybox.js?b84fd"></script>

<script type="text/javascript">

$(document).ready(function() {

/* This is basic - uses default settings */

$("a#single_image").fancybox();

/* Using custom settings */

$("a#inline").fancybox({
'hideOnContentClick': true
});

/* Apply fancybox to multiple items */

$(".iframe").fancybox({
'transitionIn'    :    'elastic',
'transitionOut'    :    'elastic',
'speedIn'     :    600,
'speedOut'     :    200,
'overlayShow'    :    false
});

});

</script>


<p><a class="iframe" href="url/of/.pdf">Zero</a></p>

希望有人能够帮助我。

- zen

你能创建一个 jsfiddle.net 吗？ - Reigel Gallarde

@Reigel 我刚刚按照你说的使用了jsfiddle.net，但是弹出框似乎没有弹出 http://jsfiddle.net/g36YD/2/ - zen

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- shubhra · Accepted Answer

当事情不顺利时，最好在Chrome的控制台或Firefox的Firebug中查找错误。在您的情况下，如果您查看了，您会看到"Uncaught ReferenceError: jQuery is not defined"，这意味着您需要使用jQuery使fancybox正常工作。此外，您需要将jquery mousewheel和jquery easing与fancybox.js一起包含。

这里有一个演示可以供您参考。http://jsfiddle.net/g36YD/7/

<p><a class="iframe" href="http://contents.tacticalasia.com/download/511-Tactical-Catalog-2012.pdf">Zero</a></p>

$("a.iframe").fancybox({
'width': 640, // or whatever you want
'height': 480, // or whatever you want
'type': 'iframe'
});