クリッカブルマップを正確な座標点で作成する方法 | NIWAKASOFT
不動産系のサイトや、求人媒体系のサイトでよく見かける、地図画像上の県や地域毎にリンクを設定して、オンマウスで該当範囲が切り替わるアニメーションを今回は作成して行こうと思います。※今回の記事はアドビの画像編集ソフトをフル活用いたします。主にフォトショップ（イラストレーター・ファイヤーワークスでも可）を使用致しますので該当ソフトが無い方は申し訳ありません。 まずは下のサンプルを御覧ください、それぞれの県の上でオンマウス時に画像が切り替わっていると思います。 このサンプルの地図のように「四角」で区切られたリンク領域であればドリームウィーバーで完結出来てしまいますが、例えばディフォルメされていない正確な地図にクリッカブルマップを作成したい場合などに力を発揮することができます。それでは早速作成手順の紹介です!! フォトショップ等で地図として使用したい画像の作成 画像は2枚必要になります。 元画像 オ
jQuery でイメージマップ：ほんっとにはじめてのHTML5 サンプル
jQuery プラグイン ImageMapster で、イメージマップのロールオーバーを変化させる このサンプルは、jQueryベースの「ImageMapster」というプラグインを使っています。 画像を最低2種類（ノーマル、ロールオーバー用）だけ用意すれば良いので簡単です。 「九州」のみ、リンクを外部サイトにしています。（他はこのページの下部にリンク） ★イメージマップは本来「target="_blank"」が設定できますが、「ImageMapster」を使うと無効になるようです...。 サンプルを修正しました（2013年4月） このサンプルは「リンクできない」というご指摘をいただき、ソースを修正しました。 ご迷惑をおかけした方々、申し訳ございませんでした。 解決のソースを送信してくださった中村様、ありがとうございました！！ 以前のソースはこちら。 ロールオーバーで japan2.gif
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
