質問

私は、多くのモダンなウェブサイト (例: facebook や Google 画像検索) で、ユーザーがページを十分にスクロールして可視ビューポート領域内に画像を表示したときにのみ、折り目の下の画像がロードされることに気づきました ( ソースを表示すると、ページには X の数が表示されます。 <img> タグがありますが、それらはサーバからすぐに取得されるわけではありません。 ). このテクニックは何と呼ばれ、どのように動作し、どのように多くのブラウザで動作するのでしょうか。また、最小限のコーディングでこの動作を実現できる jQuery プラグインはありますか。

編集

ボーナス: HTML 要素に "onScrolledIntoView" または同様のイベントがあるかどうか、誰かが説明してくれますか。そうでない場合、これらのプラグインはどのように機能するのでしょうか。

どのように解決するのですか？

ここにある回答のいくつかは、無限ページのためのものです。サルマンが質問しているのは、画像の遅延ロードです。

プラグイン

デモ

EDIT これらのプラグインはどのように機能するのですか？

簡単な説明です。

1. ウィンドウサイズを求め、すべての画像の位置とその大きさを求める
2. 画像がウィンドウサイズ内にない場合、同じサイズのプレースホルダーに置き換える
3. ユーザーが下へスクロールし、画像の位置が < スクロール + ウィンドウの高さであった場合、画像が読み込まれます。