1.0.0 • Published 6 years ago
image-loaded-promise v1.0.0
image-loaded-promise
なにこれ
要素の画像読み込みを待つ。
Lazy Load対応。
使い方
$ npm i image-loaded-promise
import imageLoadedPromise from 'image-loaded-promise';
// or CDN, Dynamic import
const {default: Mod} = await import('https://cdn.rawgit.com/honeo/image-loaded-promise/master/image-loaded.min.mjs');
// img.srcを監視
await imageLoadedPromise(img);
// background-imageを監視
await imageLoadedPromise(div);
// PNG画像がURLに設定されるまで待ってから監視
await imageLoadedPromise(img, /\.png$/);
API
imageLoadedPromise(element , regexp)
引数1要素の画像読み込みを監視する。
読み込み終了時に要素を引数に解决するpromiseを返す。
引数2に正規表現があるとき - 要素にそれとmatchする画像URLが設定されるまで待機する。
既に要素の画像読込が終了しているとき - 即座に解決する。
要素にsrc属性やbackground-Imageが未設定なとき - 要素に画像URLが設定されるまで待機する。
注意
- MutationObserver - Web API インターフェイス | MDNを使っている。 - レガシー環境では要Polyfill.
- 同じような名前の他ライブラリ・モジュールとは一切関係ない。
1.0.0
6 years ago