勉強したことのメモ

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

  関連記事

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

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

JSやjQueryで動的に追加した要素に対して「slick」でスライダーを実行する方法

外部サーバからAjax等で画像URLを取得したものをimgタグとしてページ内に描 ...

「slick」で作成したスライダー画像にランキングの順位を表示する方法

「slick」で作成したスライダー画像に対して、ランキングの順位を表示したいとい ...

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

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

Dropzone.jsを使って画像をドラッグ&ドロップでアップロードする方法

画像を複数枚ドラッグ&ドロップでアップロードしたかった。だいぶ前にDro ...