以前も紹介したような気がしますが、
最近また使用して改めて便利だったのでご紹介。◆rwdImageMaps
https://github.com/stowball/jQuery-rwdImageMaps画像の一部にリンクを張るクリッカブルマップですが、
スマホやタブレット等、画像が可変になる場合には
対応するとこが出来ませんでした。クリッカブルマップは、
画像の左上からの座標を基準にエリアを指定するので
画像の幅が可変するレスポンシブデザインだと
どうしてもずれてしまうんですよね。そんな時に使用するのがこの「rwdImageMaps」。
「jquery.rwdImageMaps.min.js」をダウンロードして
jQueryと一緒に読み込むだけ。あとは通常通りにクリッカブルマップを設定してください。
画像のサイズが変わる度に、javascriptで座標を取得しなおしてくれます。
昔からある有名なスクリプトですが、未だに現役で助かります。
ぴの子
Staff blog