簡単にフォトアルバムが出来る！ - 若おばちゃまのweb宝石箱

Designwalker

DesignwalkerというところにあるLightbox2というものを利用して
写真をかっこよく見せる方法を習いました。

まず『Designwalker』を検索し、サイト内にあるgoogleにて『Lightbox2』を入れ検索。
すると、12番のLightbox2に辿り着ける。

そして、ダウンロード。

今回は5枚のフォトアルバムを作ったので、
大きく表示されるimage 450×338とサムネイル 100×75を5枚ずつ用意しました。
※サムネイルをつくるとき、Photoshopのファイル　自動処理　Webフォトギャラリーを利用すると
　一気に作ってくれるので便利です！
　保存先のフォルダにthumbnailsというフォルダが出来上がり、そこにサムネイル画像がが収納される。

ダウンロードした際に出来た『lightbox2.04』フォルダ内のindex.htmlの記述を下の内容に
書き換える。

<body>

<a href="images/image-1.jpg" rel="lightbox[roadtrip]"><img src="images/thumb-1.jpg" width="100" height="75" alt="" /></a>
<a href="images/image-2.jpg" rel="lightbox[roadtrip]"><img src="images/thumb-2.jpg" width="100" height="75" alt="" /></a>
<a href="images/image-3.jpg" rel="lightbox[roadtrip]"><img src="images/thumb-3.jpg" width="100" height="75" alt="" /></a>
<a href="images/image-4.jpg" rel="lightbox[roadtrip]"><img src="images/thumb-4.jpg" width="100" height="75" alt="" /></a>
<a href="images/image-5.jpg" rel="lightbox[roadtrip]"><img src="images/thumb-5.jpg" width="100" height="75" alt="" /></a>

</body>

『lightbox2.04』フォルダ内にあるimagesフォルダ内に先ほど用意した画像データを
入れる。
※ファイル名を記述通りに合わせておくと後で楽。

すると、こんな見栄えの良いフォトアルバムが完成しちゃいます！
おばちゃまの肉となった輝かしい産物

サムネイルをクリックすると始まります。