javascript無しでページ内の文字や画像の選択を無効にする方法

2016/02/15

HTMLページの文字や画像が選択できるとスマホでページスクロールする時に誤って文字列を選択してしまい、ユーザーの意図してない動作をしてしまいます。

また、文字列をコピペして欲しくない場合もこの方法が有効（抜け道はありますが。。。）

スタイルシートに以下の記述をするだけでテキストや画像の選択が出来なくなります。

IE11とFirefox 44でテストしました。以下はbodyタグにスタイルシートを追加した例です。


body {
  -webkit-user-select:none; 
  -khtml-user-select:none;
  -moz-user-select:none;
  -ms-user-select:none;
  user-select:none; 
}