可視部分の画像のみを読み込むjavascript「lazierLoad 」

このエントリーを含むはてなブックマーク はてなブックマークを見るこの記事をクリップ!Yahoo!ブックマークに登録このエントリーをdel.icio.usに追加する

[ 1分で読めて簡単導入できます]

ブロードバンド環境が整いつつあるとはいえ、画像を使用しすぎるとローディングが長くなります。
lazierLoadは見えている部分の画像のみを読み込んで表示するjavascriptです。
proLazierload

使用方法
lazierLoadからlazierLoad.jsをprototypeからprototype.js(v1.6)をダウンロードします。
<script src="http://yourdomain/prototype.js" type="text/javascript"></script>
<script src="http://yourdomain//lazierLoad.js" type="text/javascript"></script>

以上で完成です。
なお読み込む時に表示する画像はlazierLoad.jsの46、47行目で変更します。
this.options.replaceImage:ブランク画像
this.options.loadingImage:ローディング画像
可視部分の画像のみを読み込むjavascript「lazierLoad 」サンプル

記事作成:2007年12月17日

JavaScriptライブラリ
JavaScriptライブラリまとめ
JavaScriptライブラリのメインストリーム「jQuery」プラグインまとめ
jQueryプラグインまとめ
通が好むJavaScriptライブラリ「mootools」プラグインまとめ
mootoolsプラグインまとめ