如何根据内容的长度动态更改对象或iframe的长度

时间:2012-11-20 21:38:02

标签: javascript jquery object iframe

我正在开发一个项目,其中网页由不同的片段组成,这些片段动态加载不同类型的对象。因此,例如,在某个点,页面可能有2个片段,一个显示视频,另一个显示一些文本,另一个时间,同一页面可能显示2个文本块。内容的变化取决于用户查看它,因此相同的片段(由对象标签或iframe定义)可能包含视频(mp4,avi等)或文本(pdf,docx,txt等),或者图像等

我遇到的问题与内容的大小(特别是长度)有关。 object和iframe标签都由一个边界框分隔,我需要根据内容的长度调整大小。如果内容是30页长的PDF,我需要在网页中呈现所有30页。我不能让用户向下滚动来查看PDF的内容,我需要它尽可能无缝地成为网页的一部分。

找到的答案here似乎提供了一种可能的解决方案。我不知道JQuery但我可以学习。但是,我注意到这些示例中使用的内容始终是一个Web页面。在我的例子中,iframe的内容可以有许多不同的类型,我想知道JQuery是否可以用来确定不是网页的东西的大小。如果不能,任何人都可以建议解决我的问题吗?谢谢。

1 个答案:

答案 0 :(得分:1)

你将不得不使用jquery或javascript来动态设置iframe的高度,

这些应该有效

// For other good browsers.
$('iframe').load(function() {
  this.style.height =
  this.contentWindow.document.body.offsetHeight + 'px';
});

// Safari and Opera need a kick-start.
for (var i = 0, j = iFrames.length; i < j; i++) {
  var iSource = iFrames[i].src;
  iFrames[i].src = '';
  iFrames[i].src = iSource;
}

整篇文章Here解释了这段代码