質問: イメージマップのレスポンシブ http://timecoupon.info/sports3.phpこちらのページを作成しているのですが、地図を押した時、スマホで見た際に動作が確認できない場合があります。(レスポンシブ用のjqueryは確認済み)リロードするとうまくいくのですが、、何が原因でしょうかまたpcで見た時はいい感じなのですが、スマホだと画像のサイズが小さく使い勝手は悪く感じます。画像の大きさをスマホの時に大きくし、かつ座標がずれないようにするにはどうすればいいでしょうか。
回答: ecマスターズの田中です。html内で各画像の大きさが指定されていない中で$(document).ready(function(e) { $('img[usemap]').rwdimagemaps(); });(改行略)としているため、画像を読み込まず、画像のサイズが確定してない中でクリッカブルマップの座標再計算を行ってしまい、座標が全て0になって動作しなくなるケースがあるようです。$(document).ready(を$(window).load(に差し替えていただくか、各画像にサイズをご指定いただいた上で、再度動作の確認をお願いします。スマートフォンで閲覧時に画像を大きく、とのことですが、左右スクロールが必要なほど大きくしてしまうと、逆に利便性を欠くことになると思います。画面幅内におさまる範囲で大きくされる場合は、各画像ファイルの左右の余白をなるべく削っていただいた上で、タグの座標の再計算を行っていただきますようお願いします。(まずは1つの画像ファイルに対してお試しください)