ハイライトON、OFF 変更削除不可 TIME指定 JavaScript指定 スタイルシート指定 カスタマイズ箇所
ちょっとずるいような気がするかもしれませんが、上記バナーは全て1つの同じファイルです。元となっている画像は、背景色が透過されています。下記のものがそれです。わかりやすいようにいくつかの背景色の上に置いてみました。
この画像にスタイルシートのフィルター効果を加えています。この場合は、Gradientフィルターを加えていますので、つまりIE5.5以上、OSはWindowsのみにしか表示されないということになります。しかし、あの色数で465バイトというのはかなりおいしいのではないでしょうか?他ブラウザへの対応も考えるのであれば、背景色を色々想定して、どの色でもきちんと見えるような色でバナーを作成すればそれですんでしまいます。
ではどのように記述すればよいのか? という事になりますが、それは WebToolにある フィルターチェンジャーを利用してください。ここで紹介したものの他にもたくさんのフィルター効果があります。ただ見ているだけでも楽しいですよ。また、このフィルターを利用し、更にTIMEを融合させればもっとすごいことができます。基本的にはこうなります。
<img src=" バナーのURL" style="FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr= lightyellow,endColorStr= sandybrown); width: 88;height: 31;boder: 0;">
画像の縦横のサイズ、枠線の太さの指定ですが、ここで書かれているようにスタイルシートでサイズ指定することをお勧めします。フィルター効果の中には、ポジション指定、もしくはサイズの指定がされていないと表示されないものがいくつかあります。ですので、上のようにスタイルシートでサイズ指定をされた方がよいでしょう。
|