我设法动态设置包含 pdf 的嵌入元素的高度。使用 jQuery 设置新高度。但我不觉得我使用了最好的“解决方案”。
旧高度 = html 中设置的高度
新高度 = 使用 jQuery 设置的新计算高度
我遇到了一个问题:我的嵌入元素的旧高度为 200px。当我尝试用新高度覆盖它时,嵌入元素确实更改为新高度,但 PDF 高度保持在 200px。
但是当我将旧高度设置得更高(5000px)时,pdf 对新高度做出了正确的 react 。
简短版本:
新嵌入高度 > 旧嵌入高度 = pdf 高度保持旧嵌入高度
新嵌入高度 < 旧嵌入高度 = pdf 高度正确
我当前的代码如下所示:
<object>
<embed id="embed_pdf" type='application/pdf' src="/files/<?=$var['filename']?>" data-width="<?=$var['image_width']?>" data-height="<?=$var['image_height']?>" style="max-width:<?=$var['image_width']?>px;" width="100%" height="<?=$var['image_height']?>"/>
<p>Error message</p>
</object>
还有我的“脚本”代码:
$(document).ready(function() {
var pdf_width = $("#embed_pdf").attr("data-width");
var pdf_height = $("#embed_pdf").attr("data-height");
var object_width = $("#embed_pdf").width();
var object_height = (object_width/pdf_width)*pdf_height;
$("#embed_pdf").attr('height', object_height);
});
目前它正在工作,因为旧高度始终等于或高于新高度。但这是一个已知问题还是正常问题?或者我做错了什么?什么可能是更好的解决方案?
最佳答案
我在调整 IE 11 中嵌入的 PDF 插件大小时没有遇到任何问题,您使用的是哪种浏览器,并且您使用的是标准 Adobe PDF 插件吗?
$(window).resize( function(){
//$('embed').attr('height', 200);
height = $(window).height() - 75;
//alert(height);
$('embed').attr('height', height);
});
我能够在文档准备好和窗口调整大小时执行与上述类似的操作。不过,我确实将所有项目设置为 100% 宽度,例如 html、body 以及容纳我的嵌入内容的所有 div 容器。
如果您尝试获取文档或元素高度等,您可能必须首先缩小 PDF,但窗口高度应该没问题。
关于javascript - 动态设置嵌入pdf的高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29820095/