2010-04-11 89 views
3

我使用jQuery延遲加載插件推遲在大型網頁上加載下面的摺疊圖像。這很好。現在,我想將相同的技術應用於一個大型Flash對象,這個對象也是低調的。我不認爲懶惰加載插件處理的東西不是圖像(至少目前看起來並不是這樣)。我可能必須自己做。在這種情況下,如何檢測包含Flash對象的區域何時變得可見?延遲加載Flash對象

編輯:我想我可以使用jQuery尺寸插件破解一些東西,並跟蹤包含Flash對象的div

編輯2:好的,我已經在這個問題上開了一個獎金。如果任何人在我週末有機會玩這個遊戲之前就能得到它,對你來說就是+250。 :)

回答

2

如果內存爲我正確提供服務,將DOM中flash對象的wmode參數設置爲opaque將執行此操作。有一個關於各種wmode設置here

+0

「wmode」與懶加載有什麼關係? – friedo 2010-04-11 02:41:01

+0

我不確定它是否確實如此,但是我們發現,在使用備選wmode設置時,未對視口中的Flash對象進行初始化,直到滾動到視圖中。 – spender 2010-04-11 03:04:24

0

HM,我不知道這個jQuery prugin如何工作位dicussion的,但你說你想要做什麼,如果你使用的圖像 - 那麼你爲什麼不放置應該爲你的flash對象設置一個onload,如果這個onload被觸發,你用你想要的flash對象替換圖像(這是假設jquery-plungin做的很瘋狂,所以onload不是'之前開火)。我知道onload-img-tags屬性是不允許正式的,但大多數(所有?)現代瀏覽器都支持這一點(據我所知) - 也許這有助於獲得另一種解決方案沒有這些問題...

0

我認爲最簡單的方法是編輯lazy load plugin並將圖像特定代碼中的detect-when-element-is-in-view代碼分開。視圖中的檢測代碼會觸發元素上的「出現」事件(在您的情況下是容器/佔位符div),您可以將其插入以加載Flash。

0

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")); 
} 

如果你在放棄該獎金讓我知道,我會考慮多一點還是有興趣的。

0

看着懶加載插件的源代碼,你會發現沒有太多的魔法發生。基本上有兩件有趣的事情發生在那裏:

  • 有一種方法,通過獲取包含窗口的高度和元素的偏移量來確定元素相對於摺疊的位置。
  • 也有一個事件處理程序,偵聽滾動事件並且檢查是否有任何「隱藏」圖像的需要出現

因此,爲了延遲加載我只是重複使用或撕裂了決定是否功能一個給定的元素是否在視圖中。連接到滾動事件,如果需要出現的東西,你使用swfobject嵌入SWF。這應該做到這一點。

也可以看看在延遲加載插件source,它真的並不難。