【问题标题】：Scroll PDF using JavaScript使用 JavaScript 滚动 PDF
【发布时间】：2016-01-14 06:27:38
【问题描述】：

我发现了一个类似的问题Scroll PDF embedded in HTML，但没有看到答案。有人对如何操作 iframe 中显示的 PDF 有任何建议吗？与上一篇文章链接类似，当 iframe 没有焦点（主机页面有）时，我尝试滚动 PDF。

谢谢！

【问题讨论】：

您总是可以先将焦点设置到 iframe。你究竟想如何滚动它？动画或只是改变偏移量
你能试试我的答案吗？
只是为了改变偏移量。我正在尝试您所说的，但仍在确定如何动态计算 PDF 大小。这是我正在测试的示例。 fiddle.jshell.net/mawaru/hx76LabL。我认为最好的解决方案是使用 PDF.js 进行渲染，但希望有不同的方法。
使用它： $.fn.resizeiframe=function(){ $(this).load(function() { $(this).height( $(this).contents().find( “身高（））; }）; $(this).click(function() { $(this).height( $(this).contents().find("body").height() ); }); } 然后，使用它如下： $('iframe').resizeiframe();

标签： javascript jquery pdf iframe

【解决方案1】：

其实你提供的链接里有答案：

几乎没有。

您可以做的是将 iframe 放入 div 中溢出：自动，并给 iframe 一个非常大的高度值，所以包含 PDF 为全尺寸。使周围的 div 不那么高比 iframe。当你的按钮被点击时，滚动周围分区。

我还没有测试过，所以可能会有一些障碍，但是这个可以工作 - 并且可能是你能做的最好的。

~Pekka 웃

这很容易。你就是这样做的：

这取决于 iframe 是否“外包”，而不是来自您的服务器。就说它是外包的吧

代码

<div id="iframeContainer" style="width: 800px; height: 600px; overflow: auto;">
   <iframe width="1800" height="6000" src="yourPDFfileSRC" scrolling="no">
   </iframe>
//You have to know exact width and height of PDF file
</div>

<script type="text/javascript">
$("document").ready(function()
{
  $("#iframeContainer").scrollTop(1400);
});
</script>

奖金

你可以这样动画它：

<script type="text/javascript">
    $("document").ready(function()
    {
      $("#iframeContainer").animate({scrollTop: 1400}, 500); //500 - time of animation
    });
</script>

【讨论】：