使用JavaScript滚动PDF [英] Scroll PDF using JavaScript

查看:101
本文介绍了使用JavaScript滚动PDF的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我发现了一个类似的问题滚动嵌入HTML的PDF 但没有看到一个答案。有没有人对如何操作iframe中显示的PDF有任何建议?与之前的帖子链接类似,我正在尝试在iframe没有焦点时滚动PDF(主页确实如此)。

I found a similar question Scroll PDF embedded in HTML but didn't see an answer. Does anyone have any suggestions for how to manipulate a PDF displayed within an iframe? Similar to the previous post link, I'm trying to scroll the PDF when the iframe doesn't have the focus (the host page does).

谢谢!

推荐答案

实际上您提供的链接中有一个答案:

Actually there is an answer in the link You provided:


很难。

Hardly.

你可以做的是将iframe放入一个带有
overflow:auto的div中,并给出iframe是一个非常大的高度值,所以包含PDF的
是全尺寸的。使得周围的div比iframe更高。
。单击按钮时,滚动周围的
div。

What you might be able to do is to put the iframe into a div with overflow: auto, and give the iframe a very large height value so the containing PDF is at full size. Make the surrounding div less tall than the iframe. When your buttons get clicked, scroll the surrounding div.

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

I haven't tested it so there may be some snag on the way, but this could work - and is probably the best you can do.

~Pekka웃

这很简单。这就是你如何做到的:

It's pretty easy. That's how you do it:

这取决于iframe是out-source,而不是来自你的服务器。
我们只是说它是外源的

It depends on whether the iframe is "out-source", not from your server. Let's just say that it is out-source

<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>



BONUS



你可以像那:

BONUS

You could animate it like that:

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

这篇关于使用JavaScript滚动PDF的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆