PDFレスポンスズームブラウザでのサイズ変更

Question

PDFのズームを常にiframe内で全幅にしようとしています。ブラウザのサイズを変更すると、PDFのズームが再計算され、ブラウザの幅が100％に設定されます。

pdf parameter＃view = Fitまたは＃zoom = 100はドキュメントの準備ができていますが、ブラウザのサイズを変更したときにスクロール位置を失うことなく、この値をリフレッシュ/再計算することはできません。

<iframe id="readFrame" src="https://xxxxxx.pdf#view=Fit"></iframe> 

注：まあ、私はあなたがここに誤植があると思う

$(document).ready(function() { 
    $(window).trigger('resize'); 
}); 

$(window).resize(function() { 

    var browser_viewportH = $(window).height(); 
    var browser_viewportW = $(window).width(); 

    var nav_height = $("#nav-bar").height() + $("#tempWrapper").height(); 
    var block_height = $("#blockContainer").height(); 

    var viewportH = browser_viewportH - (nav_height + block_height); 

    $("#readFrame").css("height", viewportH); 
}); 

Answer 1

誰がこの問題に遭遇場合、私はpdf.jsを使用して終了。

pdfパラメータを使用する際の問題は、これらのブラウザに独自のpdfビューアがあるため、ChromeおよびFirefoxでは動作しないことです。

一方、pdf.jsはChromeとFirefoxでのみ完全にサポートされていますが、その他のサポートは制限されていますが、< = IE8以外は機能しています。

Answer 2

：

$("#read iframe").css("height", viewportH); 

は

であるべき私はこのようなインラインフレームのサイズを変更しています

$("#readFrame").css("height", viewportH); 

iframeにID「readFrame」がありますか？

Answer 3

<iframe id="readFrame" src="YOUR_PDF_PATH.pdf#view=Fit" style="width:100%;"></iframe> 
<script type="text/javascript"> 
$('#readFrame').css('height',$(window).height()); 
</script> 

あなたがこれを使用することができ、これは同様にリサイズ上で動作し、サイズを変更したときに、これはあまりにもあなたのスクロールの高さを失うことはありません。..