イメージマップをレスポンシブ対応にできるjQueryプラグイン「RWD Image Maps」!

2015/12/20

こんにちは。
今回はイメージマップをレスポンシブ対応にできるjQueryプラグイン「RWD Image Maps」!です。

レスポンシブサイトにイメージマップを使う機会があり、jQueryプラグイン「RWD Image Maps」を使うと簡単にレスポンシブ対応にさせる事ができたので紹介します。

イメージマップをレスポンシブ対応にできるjQueryプラグイン「RWD Image Maps」!

RWD Image Maps

rwd-image-maps

 

「RWD Image Maps」をダウンロードしてみよう!

https://github.com/stowball/jQuery-rwdImageMapsにアクセスして右にある「Download ZIP」のボタンをクリックしてダウンロードします。

 

「RWD Image Maps」の使い方

jQuery本体とjquery.rwdImageMaps.min.jsを/bodyの手前に読み込みます。

 

その下に下記のスクリプトを記述します。

 

html部分を記述します。
html部分はいつも通り普通にコーディングして大丈夫です。

 

プラグインを使わないスキルを身につけたい人のためのjQueryテクニカルノート
プラグインを使わないスキルを身につけたい人のためのjQueryテクニカルノート

 

いかがでしたか。これはすごく便利ですね。
イメージマップをレスポンシブ対応させる場合は是非!
以上でイメージマップをレスポンシブ対応にできるjQueryプラグイン「RWD Image Maps」!でした。

topへ戻る