我正在尝试使用jQuery Lazy Load plugin，它在我的静态HTML页面上运行良好。但是，当我尝试在具有固定高度的iframe中加载同一页面时，图像不会延迟加载，它们会立即加载。
以下是iframe的调用方式：
<iframe src="file.html" frameborder="0" height="2500" scrolling="no" width="100%" onload="resizeFrame()" style="height: 2500px;"></iframe>
我对DOM看到iframe的方式不太熟悉，但可能是插件看到iframe高度并假设图像在当前视口内？
有解决此问题的简单方法吗？我的目标是在向下滚动父页面时将图像加载到iframe中。
谢谢！
编辑：我应该澄清JavaScript lazyload调用已经在file.html内发生，并且如果我自己加载file.html则可以正常工作。当我将file.html作为iframe加载到另一个页面时，它无效。
答案 0 :(得分：2)
延迟加载插件使用jQuery .height（）方法通过将此高度与元素顶部偏移量进行比较来确定特定元素（或本例中的图像）是否在视口内。由于你的iframe的固定高度为2500px，你的“viewport”.height（）也将是2500px。这就是它一次加载所有图像的原因。它不考虑父DOM的高度，只考虑iframe。
如果您希望图像延迟加载，您唯一的选择是让用户在iframe中滚动。
答案 1 :(得分：0)
尝试将延迟加载事件添加到iframe图像：
$("img.lazy").lazyload();
$( "iframe" ).children( 'img' ).lazyload();