勉強したことのメモ

Webエンジニア / プログラマが勉強したことのメモ。

jQueryで画像を遅延ロードする「jquery.lazyload.js」の利用方法

   2024/05/22  jQuery

画像を遅延ロードさせたい時には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
});

 

参考サイト

http://www.koikikukan.com/archives/2012/11/21-015555.php

 - jQuery

  関連記事

画像アップロード前の時点で画像が選択されているか確認
画像アップロード前の時点で画像が選択されているか確認

やりたかった事は、フォーム内で画像をアップロードする際、 ちゃんと画像がローカル ...

jQueryの画像スライダー用プラグイン「slick」の使い方
jQueryの画像スライダー用プラグイン「slick」の使い方

jQueryの画像スライダー用プラグイン「slick」の使い方についてソースコー ...

jQueryで画像が存在すれば表示、なければノーイメージ画像を表示
jQueryで画像が存在すれば表示、なければノーイメージ画像を表示

やりたかった事は以下の通り。 ・画像のURLはcode.jpgみたいになってる ...

jquery.snipeの使い方
jquery.snipeの使い方

使い方によっては面白くなりそう。 ■jquery.snipe http://ra ...

Ajaxでプラグイン無しのファイルアップロード方法
Ajaxでプラグイン無しのファイルアップロード方法

画像ファイルを添付できて、尚且つAjaxを用いた非同期通信のフォームを作りたかっ ...