ImageButton は、リンクボタンを作るためのアプレットです。従来のHTMLの記述でも、画像にリンクボタンの機能をもたせることはできましたが、 あくまで概念としてのボタンであって、実際にボタンのように見えるわけではありませんでした。
ImageButton を使うことによって、イメージを貼り付けただけの平板なリンクボタンを、 本当のボタンのように立体的にし、かつ、インタラクティブに動作させることが可能になります。
更に、元の画像の色彩を変化させることにより、 マウスカーソルが重なった時とそうでない時のイメージを変化させることもできます。
上のボタンを押すと、ImageButtonのもうひとつの機能について説明するページに 飛びます。
色相、彩度、明度のそれぞれについて細かく指定できますので、 設定しだいで以下のように同じ画像でも色々な表現が可能です。
（下のボタンには、リンクを設定していませんので、 心ゆくまで試し押し(?)してみてください。）
- HTMLファイルと同じ場所（ディレクトリ）に、クラスファイル （ImageButton.class と HSBImageFilter.class）を置きます。
- HTMLファイルと同じ場所（ディレクトリ）に、ボタンに貼り付けたい画像ファイルを 置きます。
- HTMLファイルには、例えば次のように記述します。 （"MARK083.GIF"は画像ファイル名です。 また、"frame.html"は、リンク先のファイル名です。 ファイル名は、大文字・小文字を区別する必要があります。）
<applet code="GrayButton.class" width=80 height=80>
<param name="image" value="MARK083.GIF">
<param name="saturation" value="0">
<param name="url" value="frame.html">
</applet>
これは、このページの先頭で表示している ImageButton の記述内容です。
これで出来上がりです。
以下をクリックすれば、ImageButton をダウンロードできます。
圧縮ファイルですので、解凍してからご利用ください。以下をクリックすれば、ソースコードを見ることができます。
■ appletタグで指定するパラメータ
名前 設定値 意味 class ImageButton.class クラスファイル名（固定） width 正の整数 アプレットの横幅 height 正の整数 アプレットの縦幅 vspace 正の整数 アプレット上下の余白（省略可） hspace 正の整数 アプレット左右の余白（省略可） ■ paramタグで指定するパラメータ（image以外は省略可）
name value 意味 image 画像ファイル名 ボタンに貼り付ける画像ファイル名 url URL（または、パス名） リンク先のファイルを示すURLまたはパス名 bgColor 6桁の16進数（RGB値） ボタンの背景色（デフォルトは、C0C0C0） border 正の整数 ボタンの外枠の幅（デフォルトは、2） hue 6.0未満の実数 色相の変化を指定。0:赤、1:黄、2:緑、3:シアン、4:青、5:マゼンタ。 中間値はそれらの中間色。負の値は、オリジナルの色相。（デフォルトは、-1） saturation 0以上の実数 彩度の変化を指定。1がオリジナルの彩度。小さくなるほど淡い色、 大きくなるほど濃い色。0が無彩色。（デフォルトは、1） brightness 0以上の実数 明度の変化を指定。1がオリジナルの明度。小さくなるほど暗い色。 大きくなるほど明るい色。0が黒。（デフォルトは、1） reverse true または false trueの場合、マウスカーソルが重なった時に 色彩を変化させる。falseはその逆。（デフォルトは、false。） target フレーム名 リンク先のページを表示させるフレーム名。 （_blank, _self, _parent, _topなど。HTMLで使用するフレーム名と全く同じ意味。）