ロールオーバー効果を使用して、画像にマウスを置いた時にマウスから離れた場所の画像を同時に入れ替えることができます。
※以下はホームページ・ビルダー12の画面ですが、ホームページ・ビルダー13以降のバージョンでも、ほぼ同様の操作で行うことができます。
※以下の操作は事前にページ内にロールオーバー効果を挿入しておく必要があります。ロールオーバー効果の挿入方法に関しては、以下のFAQを参照してください。
■操作
- ページを表示した時に最初に表示される画像を挿入しておきます。
- 挿入されているロールオーバー画像を選択し、メニューバーから「編集」→「属性の変更」を選択します。
「画像のロールオーバー効果の設定」ダイアログが表示されます。
- [他の場所の効果] タブをクリックし、[追加] ボタンをクリックします。
「他の場所の効果 (場所の指定)」ダイアログが表示されます。
- 左上の [ページ内の画像] 欄から入れ替える場所の画像を選択し、[次へ] ボタンをクリックします。
「他の場所の効果 (効果の指定)」ダイアログが表示されます。
- [ファイル名を指定する] を選択して [参照] ボタンをクリックし、入れ替える画像を選択します。[完了] ボタンをクリックします。
※ここでは、素材集から画像を選択しています。
「画像のロールオーバー効果の設定」ダイアログに戻ります。
- [OK] ボタンをクリックし、設定を終了します。同様の手順でもう1つのロールオーバー画像も設定してください。
- プレビュー画面で動作を確認します。(以下の画像はイメージです)