ku
テンプレ配ったりとか。
Lightboxを使う(frestyle)
- Posted at 2010.05.09
- lfrestyle
frestyleは標準でLightboxに対応しているので、
↑クリックしてみてください。
こんな感じに小さい画像クリックで大きい画像をその場で表示するみたいなことが出来ます。
使い方は、画像を貼ると出てくるタグ
あと補足で、画像をグループ化というか「NEXT」をクリックすると次の画像へ、「PREV」をクリックすると前の画像へ・・・みたいなことがやりたい場合には、
追記(2010-05-18):「こんなコード追加するのめんど~い」っていう人のために、普通に記事書いたら自動的にLightboxで表示してくれるプログラム書きました。

↑クリックしてみてください。
こんな感じに小さい画像クリックで大きい画像をその場で表示するみたいなことが出来ます。
使い方は、画像を貼ると出てくるタグ
<a href="http://blog-imgs-44.fc2.com/y/k/u/ykuu/kuu720.jpg" target="_blank"><img src="http://blog-imgs-44.fc2.com/y/k/u/ykuu/kuu720s.jpg" alt="空" border="0" width="120" height="299" /></a>みたいなのを
<a href="http://blog-imgs-44.fc2.com/y/k/u/ykuu/kuu720.jpg" target="_blank" rel="lightbox"><img src="http://blog-imgs-44.fc2.com/y/k/u/ykuu/kuu720s.jpg" alt="空" border="0" width="120" height="299" /></a>
のようにaタグにrel="lightbox"
を追加してやることで実現できます。あと補足で、画像をグループ化というか「NEXT」をクリックすると次の画像へ、「PREV」をクリックすると前の画像へ・・・みたいなことがやりたい場合には、
<a href="http://blog-imgs-44.fc2.com/y/k/u/ykuu/kuu720.jpg" target="_blank" rel="lightbox[グループ名を半角英数で]"><img src="http://blog-imgs-44.fc2.com/y/k/u/ykuu/kuu720s.jpg" alt="空" border="0" width="120" height="299" /></a>
のようにしてやると出来ます。
追記(2010-05-18):「こんなコード追加するのめんど~い」っていう人のために、普通に記事書いたら自動的にLightboxで表示してくれるプログラム書きました。
スポンサーサイト