複数の画像をクラウド表示するプラグイン「imageCloud」を紹介します。
jQueryプラグイン「imageCloud」
このプラグインを使えば、ブログ（WordPress）なんかでよくみるタグクラウドのように複数の画像をクラウドのように表示することができます。
クラウド化される画像は自動的に適切なサイズ（サムネイルみたいに）に調節してくれます。
また、画像にマウスカーソルをもっていくとその画像が大きく表示されます。
それではデモページの画像クラウドをご覧ください。
「imageCloud」のデモ
デモのソース（HTML + jQuery）
<meta name="description" content="imageCloud のデモでーす。"> |
<title>jQuery Plugin - imageCloud</title> |
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> |
<script src="jquery.imagecloud.js"></script> |
<div id="demo" class="imagecloud"> |
<img src="images/01-red.png" alt="1" /> |
<img src="images/02-orange.png" alt="2" /> |
<img src="images/03-yellow.png" alt="3" /> |
<img src="images/04-green.png" alt="4" /> |
<img src="images/05-blue.png" alt="5" /> |
<img src="images/06-indigo.png" alt="6" /> |
<img src="images/07-purple.png" alt="7" /> |
<img src="images/01-red.png" alt="8" /> |
<img src="images/02-orange.png" alt="9" /> |
<img src="images/03-yellow.png" alt="10" /> |
<img src="images/04-green.png" alt="11" /> |
<img src="images/05-blue.png" alt="12" /> |
<img src="images/06-indigo.png" alt="13" /> |
<img src="images/07-purple.png" alt="14" /> |
<footer style="margin-top:20px"> |
<a href="https://webkaru.net/jquery-plugin/imagecloud/">「jQueryプラグインまとめ」に戻る</a> |
jsファイルのダウンロード、オプション詳細はこちらからどうぞ。