iOS 10のSafariでuser-scalable=noが効かないので対策した - そもそも読み物サイトではない事例

iOS10のSafariでuser-scalable=noが効かなくなった。

画面一枚で、リモコンのような機能を提供するページを作っていたため、効かないのは大変困ってしまった。
利用中に画面が拡大したり、スクロールしてしまったりで、非常にユーザ体験が悪化してしまったのである。

解決の例の一つに下記で紹介されているものがある。
http://qiita.com/pekpek/items/d74e5758a36478fbc039

上記の解決方法でもよかったのだけど、その他のついでにブラウザのデフォルトの動作を止めるために以下のようなJavaScriptで対策した。

document.documentElement.addEventListener('touchstart', function (e) {
  if (e.target.nodeName !== "INPUT") {
    e.preventDefault();
  }
}, true);

inputタグは使用していたため、inputタグ以外の動作を無視させました。