MACABOUTPORTFOLIOBLOGBLOGスマホのナビを展開する時に下のリンクを貫通してタップできてしまう問題スマホサイトの展開式メニューを制作メニュー展開の発火をjQueryで行い、アニメーション等の処理はCSS3でやってしまおう的なメニューを制作していました。メニュー本体はz-indexをネガティブに設定してコンテンツが横にスライドすればメニューが出現する仕様です。順調にメニューは実装できたのですが、iPhoneのChromeでメニューを展開する時のタップが下のリンク要素まで貫通し、想定外のページ遷移をしてしまいました。function(){$('#wrap').toggleClass('spnav-vew');});});setTimeoutで処理を遅らせて解決touchstartをclickに変更すれば問題解決しましたがtouchstartやtouchendに比べて動作がもっさりするのでなんだかなぁ〜って感じです。clickで正常な動作をするという事はタッチ後にラグさえあれば問題は解決するということなのでsetTimeoutを使ってもう1つ処理を追加してみました。function(){$('#wrap').toggleClass('spnav-vew');setTimeout(function(){$('#spnav').toggleClass('pe-none');},800);});});pointer-eventsでアンカーを無効化メニュー本体に初期状態でpointer-events:none;付与しアンカーを無効化し、少し遅らせてtoggleClassでアンカーを有効にしました。Wakai大阪でWebデザイナーをしています。メインでFireworksを使ってます。IllustratorやPhotoshopも使っています。