妙用jquery.scrollLoading.js插件,加快網頁的顯示速度

這篇文章介紹的js插件是基于jQuery開發的，它的功能如下：用戶打開網頁的時候，瀏覽 器先加載能看得到的界面（第一屏）中的圖片，第二屏、第三屏或者更下邊的圖片只有等到用戶往下拖動滾動條，瀏覽器才會依次加載。這樣的外部資源加載機制， 能讓瀏覽器更快的展示內容。問：為什么瀏覽器不使用這樣的加載機制？

插件網址：jQuery滾動加載插件scrollLoading

圖片按需加載的使用方法，作者在文中已經說明的很清楚了，我就不啰嗦了。下邊就說說，我是怎么修改jquery.scrollLoading.js插件，讓iframe框架中的內容也能按需加載的。

因 為我的博客使用了新浪微博的提供的API接口，展示了微博內容，所以頁面中加載了一定量的外部資源，有js、css、圖片等等，細數下來，一共加載了20 多個來新浪的外部資源。這么多的外部資源，如果在傳送的過程中出問題了或延時了，會不同程度的影響頁面的展示。后來分析了scrollLoading插件 的代碼，發現只要稍微修改一下，就能支持iframe框架按需加載了！

第三行代碼決定了scrollLoading插件只支持img標簽實現按需加載，為了要支持iframe標簽，要做的修改如下：

保存即可。

因為插件默認是讀取data-url中的數據，替換到src中，所以我使用如下方法調用插件，供大家參考。

好消息！ 現在訂閱阿飛博客，立即贈送最新最好最有價值的資源給你!
第一步：點擊這里
第二步：輸入您的QQ郵箱
第三步：登陸QQ郵箱，點擊確認連接
第四步：成功訂閱

　　如果感覺本文章對你有價值，可按您心情自愿付費： 支付寶 andyzeng981@163.com 曾德飛
　　除非注明，文章均為( 阿飛博客 )原創，轉載請保留鏈接: http:///434.html