QA@IT

jqueryでイメージマップ(クリッカブルマップ)使用について

6372 PV

Jqueryのプラグイン(rwdImageMaps)を使用し、スマホ用のイメージマップ対応を行いましたが、Androidは正常にクリックできますが、iphone(ios)ではクリックが無反応です。

=============================
$(document).ready(function(e) {
   $('img[usemap]').rwdImageMaps();
});

=============================

対応策があれば、教えて頂けますでしょうか。

  • JavaScript はブラウザ依存ということは認識されているでしょうか? 実際に検証したわけではありませんし、rwdImageMaps がどういうものか知りませんが、iPhone でサポートされているのは確認されたでしょうか? 的外れのコメントでしたらすみません。 -
  • ご回答ありがとうございます。
    iPhoneでサポートされているかは不明ですが、androidはOKで、iosの不具合かとも言われている様です。
    CSSやHTML部分にあることをすると治ったりする様ですが、それがわかりません。
    お願いします。
    -

回答

この記事か参考になるのでは
http://qiita.com/AkiraAlex/items/4da92072bfccc84fa6f4

編集 履歴 (0)
  • ご回答ありがとうございます。
    「横・縦幅を必ず指定」をやってみたのですが、ダメでした…
    -
  • もう一度やってみたら、なぜかクリックできるようになりました。
    ありがとうございました。
    -

  • このやり方だとスマホごとに画面サイズが違う為、クリック位置が変わりだめでした。その為、プラグイン自体を最新のものにすることで全て解決しました。
    -

  • <最新プラグインのやり方>
    http://theappproducer.com/jmap/#how で最新プラグインをダウンロードする。
    ②下記をhtmlに追記する。
    <script src="jquery.jmap.min.js"></script>
    $(window).load(function(){
    $("img[usemap]").jMap();
    });
    -

助けて下さい。m(_ _)m

編集 履歴 (1)
ウォッチ

この質問への回答やコメントをメールでお知らせします。