スライス＋ロールオーバーボタン　と　イメージ（クリッカブル）マップボタン

　　　下記1) 2) は一見似てるが、両者のソースコードは全く異なり、1）は冒頭に長文のJavaScriptを伴い複雑である。

　1) 画像をスライスして　ロールオーバーボタンを入れた例

左図はスライスして５分割して再合成したもの。 右図はこのスライスが分りやすいように境界を表示した。

ＨＰに挿入する場合、まずスライス画像を合成したTABLE を挿入し、その後にロールオーバー処理をする。
ロールオーバー処理で多量のJavaScriptが冒頭に生成するのでロールオーバー処理後にＨＰに挿入すると分りにくくなる。

上図の場合、レイヤー単位でボタンをスライスすると便利。
方法：レイヤーパレットからボタンのレイヤーを選択→　レイヤーメニューから[レイヤーに基づく新規スライス] を選択
画像数が増えるがレイアウトが崩れることない。
具体的には
・単一画像でまず挿入先Htmlファイル作成
・コード編集で、この単一画像をスライス合成Hｔｍｌファイルの <table> 〜 </table> 部分に置き換える。

リンク先はとりあえず　# にしておき、後で変更すればよい。

ロールオーバーしたいボタンがすでにある場合の設定：
いったんボタン部分を削除して通常のロールオーバーを設定する。

　2) 画像に　イメージ（クリッカブル）マップボタンを入れた例

スライス操作が不要なので、このほうが、はるかに簡単。 かつ、スライスではできない矩形以外の異形ボタンもできる。
ただし、1）のようなロールオーバーボタンはできない。　

　　戻る