[Slided.js]
http://www.netzgesta.de/slided/
画像を映写機のスライドのような枠で装飾するスクリプトです。
今回はオプションクラスのうち、色指定を行えるクラスについて解説します。
今回もこちらの写真を使います。(季節はずれですが。)
<img src=".../images/xxxxx.jpg" alt="sample" class="slided"/>
【ibgcolor】
映写機風スライド部分の色を6桁のカラーコードで指定します。
デフォルトは#FFFFFFです。
(ただし、IEの場合はデフォルト設定のままだと影部分が透過されます。)
[ibgcolorEEFFCC■]
<img src=".../images/xxxxx.jpg" alt="sample" class="slided ibgcolorCCFF99"/>
【igradient】
ibgcolorを設定している場合にグラデーションカラーを指定できます。
デフォルトはグラデーションなしです。
[ibgcolorEEFFCC■ igradientFFDDEE■ ]
<img src=".../images/xxxxx.jpg" alt="sample" class="slided ibgcolorCCFF99 igradientFFDDEE"/>
【vertical】
通常は左上から右下へグラデーション効果が現れますが、
verticalを指定すると縦方向のグラデーションとなります。
[ibgcolorEEFFCC■ igradientFFDDEE■ vertical]
<img src=".../images/xxxxx.jpg" alt="sample" class="slided ibgcolorCCFF99 igradientFFDDEE vertical"/>
【horizontal】
通常は左上から右下へグラデーション効果が現れますが、
horizontalを指定すると横方向のグラデーションとなります。
[ibgcolorEEFFCC■ igradientFFDDEE■ horizontal]
<img src=".../images/xxxxx.jpg" alt="sample" class="slided ibgcolorCCFF99 igradientFFDDEE horizontal"/>
色の効果をうまく取り入れると、
うるさくならない程度に画像表示ができそうです。