jQueryで画像を遅延ロードする「jquery.lazyload.js」の利用方法
2024/05/22
画像を遅延ロードさせたい時にはjQueryプラグインのlazyloadが便利。以下に利用方法をメモ。
lazyload
公式サイト
http://www.appelsiini.net/projects/lazyload
CDN
CDNで使う場合は以下を記述する。
<script src="https://cdn.jsdelivr.net/npm/lazyload@2.0.0-rc.2/lazyload.min.js"></script>
ソースコード
$('img').lazyload({
effect : 'fadeIn',
effectspeed : 200
});
参考サイト
関連記事
-
-
lazyload.js等のライブラリを使わずHTMLのみで画像の遅延読み込みを行う方法
画像を遅延読み込みさせるとなるとだいぶ前に書いたlazyload.jsを用いる方 ...
-
-
PHPでjpg / png画像をWebP画像に変換し保存する方法
PHPでjpg / png画像を圧縮したかった。ただjpg / pngのままだと ...
-
-
画像をアップロードすると複数サムネイルを生成する方法
フォームで画像をアップロードすると、予め定めておいた大中小のサイズでサムネイル画 ...
-
-
バニラJS対応(jQuery非依存)の画像遅延読み込みライブラリ「lazysizes」の利用方法
あるサイトのコーディングデータを貰った際に「lazysizes」というJavaS ...
-
-
PHPで画像アップロード、リサイズ、形式変換(jpg->webp等)はclass.upload.phpが便利
今までPHPで画像関連の処理を行う場合、リサイズの時のみsmart_resize ...