Html iFrame中嵌入的超长PDF显示为黑色

我在iframe中嵌入了一个PDF，它包含在一个DIV中，所以我可以控制它的滚动位置。根据存储在数据库中的PDF页面长度动态计算高度

它适用于小文档（<10页），但一旦达到30页，它就会显示为黑色。如果我把浏览器缩小到33%，它就会开始显示

代码如下：

<div id="document_pdf-wrapper" height="800px">
    <iframe src="filepath.pdf#zoom=100&amp;scrollbars=0" width="1200px" height="{{ document.page_length * 1085 }}px" /></iframe>

有人知道为什么它显示为黑色，但只有在pdf>35页时才显示吗

谢谢

---

编辑：我当时的做法是计算iframe的高度，结果是大约20页之后，高度变得太大，PDF显示为黑色。有人知道一个变通方法吗？

你可以尝试用与此相同的方式添加它，嗯，是的，这很有效，但设置静态高度也是如此。但是如果没有动态高度，我无法实现用户必须向下滚动到PDF末尾才能启用复选框的功能。我会再看一些。所以我能够让它在根据页码计算高度的地方工作。但是如果页面长度太长，它仍然会显示一个黑屏（因为iframe/embed/或您使用的任何东西都有高度限制）。有人知道如何解决这个问题吗？你知道吗？我最终使用了pdf.js。你可以尝试以与此相同的方式添加它。嗯，是的，这很有效，但设置静态高度也是如此。但是如果没有动态高度，我无法实现用户必须向下滚动到PDF末尾才能启用复选框的功能。我会再看一些。所以我能够让它在根据页码计算高度的地方工作。但是如果页面长度太长，它仍然会显示一个黑屏（因为iframe/embed/或您使用的任何东西都有高度限制）。有人知道怎么解决这个问题吗？你知道吗？我最后用的是pdf.js