消除滚动条，并将嵌入的pdf放入我的jQuery对话框

Question

我在做什么：

我正在我的网站上开发一个pdf阅读器，在我的主页上，我呈现了许多电子书封面照片，当用户单击特定电子书时，会出现一个jquery ui对话框，我使用pdfobject库呈现pdf。

我取得的成就：

单击电子书的图标，我就能在对话框中呈现pdf对象。

问题是：

显示器看起来很糟糕。pdf embededd对象中有滚动条，jQuery对话框中有滚动条（垂直和水平）。

我想要的是：

我的jquery对话框的宽度为600，高度为500，当我第一次打开对话框时，应该只有一个垂直滚动条，pdf的第一页应该完全符合我的对话框的默认尺寸（600 X 500），无论其原始尺寸是多少。如果pdf只有一页，则应该没有滚动条（除非用户单击“放大”）

Javascript代码：

$(function() {
    $( "#pdfPrompt" ).dialog({
        autoOpen: false,
        show: "blind",
        hide: "explode",
        width:600,
        height:500,
        resizable : false
    });

    $( "#opener" ).click(function() {
        $( "#pdfPrompt" ).dialog( "open" );
            var myPDF = new PDFObject({ url: "sample.pdf" }).embed('renderer');

        return false;
    });
});

opener只是我给图标的id，而pdf提示是一个简单的

例子：

你能帮我实现这个吗，谢谢




Answer 1

您可以尝试使用谷歌文档查看器，它可以自动调整已查看pdf的大小（演示）

<iframe src="http://docs.google.com/gview?url=http://samplepdf.com/sample.pdf&embedded=true" style="width:100%; height:100%;" frameborder="0"></iframe>

Answer 2

一个潜在的问题是隐藏元素没有维度。这会导致一些问题，例如谷歌地图在一个隐藏的div中被处理。pdf查看器脚本可能需要获取容器的尺寸。

因此，请删除show的动画。

您可能需要等到对话框打开才能将pdf放入对话框。

$( "#pdfPrompt" ).dialog({
    autoOpen: false,
   open:function(){
        /* code here to render pdf*/
    },
    hide: "explode",     
    width:600,
    height:500,
    resizable : false
});