フォーカス/ターゲットで画像を読み込む

Question

私はそれぞれ約50〜100kbのサイズの画像を約300以上持っています。サーバーは、ページの読み込み時にすべてのイメージを読み込むのに時間が掛かります。 Googleブックのように画像を読み込むにはどうすればよいですか？

Answer 1

「レイジーローディング」と呼ばれています。 Lazy Loading Of Images – Resources You Need は、最も一般的なJSフレームワークを使用してこれを行う方法を示しています。例えば、jQueryの中であなたがLazy load pluginでこれを行うことができ

：

HTML：

<script src="jquery.js" type="text/javascript"></script> 
<script src="jquery.lazyload.js" type="text/javascript"></script> 
... 
<img class="lazy" src="img/grey.gif" data-original="img/example.jpg" 
    width="640" heigh="480"> 

JS：あなたはイメージのため、jcaraousalのようなものの種類を

$("img.lazy").lazyload();