我的pdf文件没有在灯箱上显示,它只是保持加载但是当我使用iframe显示它时。我在一个cpanel上传了pdf,我只想让它在灯箱上查看。
这是我在iframe中运行的代码:
<p><iframe src="url/of/.pdf" width="600" height="780"></iframe></p>
这是我的灯箱代码,它没有显示pfd:
<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>
希望有人能帮助我。
答案 0 :(得分:6)
当事情不适合你时,最好在chrome的控制台或firefox的firebug中接受错误。在你的情况下,如果你看过,你会看到'未捕获的ReferenceError:jQuery未定义',这意味着你需要使用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'
});