FIREWORKSでは静止画像のGIF、JPEG以外にアニメーションGIFのファイルを作成できることは以前にも述べました。
FIREWORKSはそれだけでなく、さらにインタラクティブなGIFボタンの設定も簡単に作成することが出来ます。さっそく検証してみましょう。

以前に作成した要領で、右図のような文字入りのボタンを作ります。今回はこのボタンの上にマウスのカーソルが乗ると、文字が変化するという、インタラクティブなボタンを作成します。

まず、左図のようにフレームを複製します。要領はアニメーションGIFを作成するときと同ですが、今回はマウスが上に重なる場合の変化だけですので、合計2フレームだけになります。

今度は2フレームめ、つまり“オンマウス”の状態の画像を作成します。

マウスが上に乗った時点で文字が「CLICK！」と変化させたいので、この部分のテキストを打ち変えます。

テキストをダブルクリックして、新たな文字を上書きするだけの簡単な作業です。

細かい文字の調整は、テキストエディタで行いましょう。

画面での作業は以上で完了。あとはGIFボタンとして書き出すだけ。

ファイルメニューから書き出しを選択して、［書き出しのプレビュー］ダイアログボックスのオプションを選択し、ファイル形式を［GIFロールオーバー］に設定します。

色の設定を行ったらデータの書き出しを行います。

今回は「gohome」という名称で「test」というフォルダにGIFファイルとHTMLファイルを書き出します。

下の図が書き出された「テスト」というフォルダです。

それでは、実際に書き出されたままの「gohome.htm」というファイルを見てみましょう。

どうでしたか？ボタンの上にマウスのポインタカーソルを重ねると文字が変化して、クリックするとMacromediaのホームページにジャンプしましたね。これは全てJavaScriptで行っているのです。

書き出されたHTMLファイルをDreamweaverで修正すれば、簡単にインタラクティブなページを作ることが出来ます。