.init()(options)

更新日: 2018-06-25

init()にはいくつかのオプションがあります。

offset

type初期値説明
number/string0画像のロードを開始する表示領域からの距離を指定します。

offsetオプションは、画像のロードを開始させる表示領域の範囲(上下左右)を指定します。 0を指定した場合、表示領域が見えたらすぐにロードします。 もし上下1000px以内でロードさせたい場合は、1000を指定します。

offsetVertical

type初期値説明
number/stringoffsetの値画像のロードを開始する表示領域からの上下の距離を指定します。

offsetHorizontal

type初期値説明
number/stringoffsetの値画像のロードを開始する表示領域からの左右の距離を指定します。

offsetTop

type初期値説明
number/stringoffsetVerticalの値画像のロードを開始する表示領域からの上の距離を指定します。

offsetBottom

type初期値説明
number/stringoffsetVerticalの値画像のロードを開始する表示領域からの下の距離を指定します。

offsetLeft

type初期値説明
number/stringoffsetHorizontalの値画像のロードを開始する表示領域からの左の距離を指定します。

offsetRight

type初期値説明
number/stringoffsetHorizontalの値画像のロードを開始する表示領域からの右の距離を指定します。

throttle

type初期値説明
number/string250連続スクロール時の待機時間(タイムアウト)を指定します。

throttle機能は、 windo.onscrollイベントが連続で発生することによるパフォーマンスの低下を防ぐために、 内部機能によって管理されています。 throttleオプションを使用すると、 ユーザーがスクロールした時に、僅かな待機時間(タイムアウト)が設定され、 スクロールを停止するまで、その時間が維持されます。 初期値は250msです。

debounce

type初期値説明
booleantruedebounceを有効にするかどうかを指定します。

デフォルトでは、throttle機能は実際はdebounce機能のため、スクロールのチェックは、ユーザーがスクロールを停止した時にだけ作動します。 throttleオプションで指定したミリ秒単位で画像をチェックする、従来の方式を使いたい場合は、 debounceオプションにfalseを指定します。

unload

type初期値説明
booleanfalse読み込まれた画像を一旦アンロードするかどうかを指定します。

unloadオプションは、 表示領域を超えてスクロールした場合に、読み込まれた画像を一旦アンロードさせます。 (offset領域を含みます。)

callback

type初期値説明
functionコールバックを指定します。

callbackには、更新された要素と、 更新処理(loadまたは、unload)が渡されます。 これは要素にloadedといったクラスを追加したい場合等に便利です。

echo.init({
  callback: function(element, op) {
    if(op === 'load') {
      element.classList.add('loaded');
    } else {
      element.classList.remove('loaded');
    }
  }
});

© 2016 Todd Motto Released under the MIT license

このコンテンツはTodd Motto(toddmotto)によるEcho.jsドキュメントを翻訳/改変したものです。