jquery

皆さんお元気ですか?
久しぶりの更新、Y氏です。

忙しいのはブログを更新しない理由になるか?と聞かれたら、なります!と即答する生き方です。
忙しくてもモンハンはやってるのか?と聞かれたら、やってます!と即答できます。

さて、今回はjqueryプラグインのご紹介です。

クリッカブルマップをレスポンシブ対応に

クリッカブルマップ、皆さん使ってますか?
僕はHTMLメールを作る機会が多く割と使っていたりするのですが、ぶっちゃけあんま使わないですよね。

とは言え、使わざるを得ない場面があるのも確か。
さらに時代は進化し、レスポンシブ対応も当たり前。

そもそも画像に座標を指定してそこにリンクを張る、というのがクリッカブルマップの仕様なので、ブラウザ幅で画像が縮小された場合にズレてしまいますよね。

そこで、このプラグインです。

Responsive Image Maps jQuery Plugin

https://github.com/stowball/jQuery-rwdImageMaps

まずは上記サイトから該当のjsファイルをダウンロードします。

次にjqueryと該当ファイルを読み込ませて

 

初期化します

 

img要素のusemap属性に対して実行してますので、後はクリッカブルマップをいつものように記載すれば大丈夫。

これでレスポンシブ対応のクリッカブルマップの完成です。簡単ですね。
では今回はこの辺で!

page
1 / 1