代码之家 › 专栏 › 技术社区 › friedo

延迟加载flash对象

lazy-loading dom flash jquery javascript

friedo · 技术社区 · 15 年前

我正在使用jquery lazy加载插件来延迟在一个大型网页上加载折叠图像。这很管用。现在,我想把同样的技术应用到一个也在折叠下面的大型闪光物体上。我不认为lazy load插件处理的不是图像(至少目前看来不是这样)我可能不得不自己做。在这种情况下,如何检测包含闪光对象的区域何时变为可见?

编辑:我想我可以使用jquery dimensions插件来破解一些东西,并跟踪 div 包含flash对象。

伊迪丝2:好吧,我已经开奖了。如果有人能在我周末玩这个之前找到它,给你+250。:)

5 回复 | 直到 14 年前

Community CDub 7 年前

如果记忆服务正确,设置 wmode dom中flash对象的参数 opaque 会的。关于各种 窗口模式 设置 here

oezi 14 年前

嗯,我不知道这个jquery prugin是如何工作的,但是你说如果你使用一个图像,它会做你想做的事情-那么为什么你不把一个图像放在你的flash对象应该在的地方,设置一个 onload 对于这个映像,如果触发了这个onload,则将映像替换为所需的flash对象(即假设jquery plungin做了疯狂的事情,所以onload以前不会触发)。

编辑:我知道 重载 -img标记的属性是官方不允许的,但最多(全部?)现代浏览器支持这个(据我所知)-也许这有助于获得另一个没有这些问题的解决方案…

Jeffery To 14 年前

我想最简单的方法就是编辑 lazy load plugin 并将检测时元素在视图中的代码与图像特定代码分离。视图中的检测代码在元素(在您的情况下是容器/占位符div)上触发一个“出现”事件,您可以挂接该事件以加载flash。

David Murdoch 14 年前

lazyload不能用于脚本的原因是,lazyload查看flash对象(和)上不存在的“src”属性。

在lazyload src中,应该修改引用“src”属性的任何位置。您需要知道元素是对象还是正确地嵌入和引用它们的“源”。

例如(未测试):

/* Save original only if it is not defined in HTML. */
if (undefined == $(self).attr("original")) {
   $(self).attr("original", $(self).attr("src") || $(self).attr("data") || $(self).find("embed").attr("src") );
}

如果你还想把那笔赏金给我,请告诉我,我会进一步调查的。

ilikeorangutans 14 年前

查看延迟加载插件的源代码,您将看到没有太多的魔术发生。基本上这里发生了两件有趣的事情:

有一种方法通过获取包含窗口的高度和元素的偏移量来确定元素相对于折叠的位置。
还有一个事件处理程序,它监听滚动事件,检查是否需要显示任何“隐藏”图像

因此,为了延迟加载,我只需重用或删除决定给定元素是否在视图中的函数。连接到scroll事件,如果需要显示某些内容,可以使用swfobject嵌入swf。应该可以。

还要看看lazy load插件 source ,其实并不难。