画像(イメージ)を模造したスペースを作成する「holder.js」JavaScriptプラグイン

holder.jsは、画像を表示するのではなくダミーの画像スペースを作成するものです。

holderjs

holder.jsの使い方

holder.jsをダウンロードして圧縮ファイルを解凍します。
サイト:holder.js または(Github

holder.jsを使用するファイルにholder.jsへのパスを追加します。

<script src="js/holder.js"></script>

使い方は、imgタグに独自データの「data-src」属性を追加、値に”holder.js/幅x高さ”を設定するとイメージ用のスペースが作成されます。

<img data-src="holder.js/300x200">

また、画像スペース上にテキストを表示させることもできます。

holderjs1

テキストを表示させるには、”holder.js/幅x高さ/text:テキスト”と設定します。

<img data-src="holder.js/200x200/text:ダミー画像">

 

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です