More than 5 years have passed since last update.

iPhone 6s safariの3Dタッチで画像のプレビューが出るのを防ぐ

Last updated at 2015-10-09Posted at 2015-10-01

iPhone 6s safariで、3Dタッチによる「peek」「pop」というアクションが追加されました。

html上にimgタグで貼った画像もpeekでプレビュー表示、popでジャンプします。

これがあまり嬉しくない場合もあります。

いろいろ試した結果、img要素にevent listener追加してe.preventDefaultしてやると無効化されることが分かりました。（注：safariのみ確認）

var img = document.getElementById('testimage'); // img要素取得
img.addEventListener('touchstart', function(e) {
    e.preventDefault();
});

追記(注意!!!):
preventDefaultするとその画像上をフリックしたときのスクロールも無効化されるので要注意!

追記その２:
コメントで、styleで無効化できることを教えていただきました！

.disable-3d-touch {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
}

まさにコレが求めていたものです！＼(^o^)／
ありがとうございました！