Question

我想知道是否有人知道如何使用Fancybox / Lightbox等在jQuery中显示PDF？我试过没有成功！

Answer 1

对于fancybox v1.3.x，有这个HTML：

<a class="pdf" href="sample.pdf">open pdf file</a>

使用此脚本：

$(document).ready(function() {
 $(".pdf").click(function() {
  $.fancybox({
   'width': '70%', // or whatever
   'height': '90%',
   'autoDimensions': false,
   'content': '<embed src="'+this.href+'#nameddest=self&page=1&view=FitH,0&zoom=80,0,0" type="application/pdf" height="99%" width="100%" />',
   'onClosed': function() {
     $("#fancybox-inner").empty();
   }
  });
  return false;
 }); // pdf 
}); // ready

当然，请务必首先加载jQuery和fancybox js和css文件

请注意，我在<embed>标记内设置了height =“99％”。如果您使用HTML5 DCTYPE，它将避免双垂直滚动条。这是因为HTML5初始化边距的方式。

对于fancybox v2.x ：如果您使用的是fancybox v2.x，则可以使用相同的脚本，但不需要onClosed选项，因此请删除

'onClosed': function() {
 $("#fancybox-inner").empty();
}

来自脚本和content选项之后的最后一个试用逗号。

同时更改autoDimensions的{{1}}字词。

在jQuery PopUp中显示PDF

1 个答案: