チュートリアルのトップへ >> Fireworksトレーニングのトップへ ■コラムのトップへ ■オリジナルプロダクト ■制作料金
ロールオーバーで変化しない扉ページを作る

下の図版はスライス設定時のパレットですが、通常のロールオーバー以外に
「Downでフレーム3を表示する」と「onClickでフレーム4を表示する」という項目あります。3フレーム目と4フレーム目に設定した画像もロールオーバー機能として使用できるのです





「onClickでフレーム4を表示する」というのは、画像をクリックして目的のリンク先に接続される間の時間に表示される画像です。


「Downでフレーム3を表示する」は動かない扉ページのイメージを作ります。


説明するのがややこしいので、実際に例を挙げていきます。



まず、下のような画像を用意します。それぞれ独立した画像イメージが4つ並んでいます。これをそれぞれのリンクボタンに設定します。






この画像を2フレーム目に複製を作ります。


複製をした2フレーム目の画像に対して、オンマウス時の画像イメージを制作します。マウスが重なったときに、飛びたいページへの案内を意味する文字を入れました。


2フレーム目を3フレーム目に複製して、文字の部分を変更します。この3フレーム目の画像がHTMLの扉として動かないイメージになります。


次に3フレーム目を4フレーム目に複製します。ここのフレームはリンク先に接続する間、表示する画像になります。


単に文字が変わるだけでは面白くないので、画像を全て反転してみました。これでクリック感が表現できるのではないでしょうか?


仕上げとして、1フレーム目に戻って画像を加工します。1フレーム目は、何もしない状態。画像を全て薄い色合いにしました。






画像の色合いの変更(カラーコレクション)にはエクストラ→PhotoOpticsを使うと便利です。

複数の画像を選択しても同じ設定で、画像のカラーコレクションを変えてくれます。



スライス設定を行います。スライスしたいエリアをURLパレットのスライスツールを使って分割します。

この時に、このページの一番上にあるように、「Downでフレーム3を表示する」と「onClickでフレーム4を表示する」という項目をチェックしておくことを忘れないようにして下さい。これをチェックしないと、3フレーム目と4フレーム目の処理は行いません。

最後に[スライスの書き出し]で分割出力します(上画面) この時に「Down確認用のロールオーバーHTMLを作成」をチェックします。


以上の設定で書き出された状態が、上の図です。通常はtest.htmという書類だけですが、「Down確認用のロールオーバーHTMLを作成」をチェックしたことによって、test_demo.htmというHTML書類を書き出しました。

下のロールオーバーは、test.htm書類の中の設定をコピーしたものです。下の画像をクリックすれば(どこでも)test_demo.htmにジャンプできるようにしてあります。実際に扉とは何なのか?確かめてみて下さい。



 


  

このWEBサイトに掲載されている文書・画像・映像・写真等の著作権はSilicon Cafe'に帰属し、許諾なく 複製・頒布を行うことは 法律で固く禁じられています。 Copyright (C) 1995-2003 Silicon Cafe'. All rights reserved