jquery - 消除滚动条并将嵌入式pdf放入我的jquery对话框中

我在做什么 ：

我正在网站和主页上开发pdf阅读器，我渲染了许多电子书封面照片，并且当用户单击特定的电子书时，出现jQuery ui对话框，我使用。

我取得了什么：

单击电子书图标，即可在对话框中呈现pdf对象。

问题 ：

显示看起来很糟糕。pdf嵌入对象中有滚动条，而jquery对话框中有滚动条（垂直和水平）。

我想要的是 ：

我的jquery对话框的width = 600和height = 500，当我第一次打开对话框时，应该只有1个垂直滚动条，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;
    });
});

开罐器只是我给图标的ID，而pdfprompt是一个简单的<div>

范例：



在尝试了charlietfl的解决方案（jsFiddle）之后：

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

最佳答案

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

为此，请删除show的动画。

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

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