クリッカブルマップ（イメージマップ）をレスポンシブ対応にする

あまり必要な場面はないかもしれませんが、今回必要になったので覚書として。

まずはDreamweaverなどでも座標を簡単に作成することが出来ますが、サイトでも簡単に作成できます。

私が利用しているのはこちらのサイト。

他にも同じようなサイトはあるので、ググって使いやすいサイトを利用するのも良いかもしれません。

ではレスポンシブに対応させるには以下のjQueryを利用します。

jQuery RWD Image Maps

使い方はいたって簡単。

まずはjQueryを呼び込んで、上記GitHubよりダウンロードしたjQueryを追加する。

そして以下を追加すればOK！

$(function() {
　$('img[usemap]').rwdImageMaps();
});

レスポンシブ設定はcss等で設定すればOKです。