Webページのテキストを選択できないようにしているサイトについて
Webページを閲覧しているとたまにテキスト選択できないページがあります。
普段ページを見てるときはカーソルでテキスト選択後コピーして必要な個所をサクラエディタに貼り付けてメモするようにしています。また癖として反転できないページにであうとつるつるのガラスの上から記事を見てるような気分になってイライラしてきます。解除する方法は以下の手順で大概のサイトは可能ですが今後そんなサイトを見つけるたびに記録していくことにしました。
＜参考にしたページ＞
＜UserCSSの登録をしなくてもこれで対処できそうです＞
WebサイトによってはJavaScriptではなくCSSのuser-selectを使用してテキストのコピーを無効化していることがある。
例: うたまっぷ
このようなサイトではChromeのメニューの表示=>開発/管理=>デベロッパーツールからConsoleを開き、下記のコードを貼り付けてEnterキーで実行するとCSSのuser-selectを無効化することでテキストがコピーできるようになる。
var css = '* { user-select: auto !important; }';
var head = document.head || document.getElementsByTagName('head')[0];
var style = document.createElement('style');
head.appendChild(style);
style.appendChild(document.createTextNode(css));
＜出会ったWebページ＞
＜解決できなかったサイト＞
なんと以下のサイトは以前は解除できてたのにできなくなっていました。
Web関係の仕組みはあまり詳しくないので今のところお手上げです。
・F12でやればテキスト自体は取り出し可能ですがページ上での選択が出来なくなってました。以前はできてたのに・・・。CSSを埋め込むツールは拒否されて実行できなくなっていました。どうやれば拒否できるかを調べる必要がありますが一旦諦めることにします。
2019/09/27(金) 10:55:34
今日再度チャレンジしたら解除できてしまいました！
ただ何が正しかったのかはよくわかっていません。
解除するためにやったこと。
１．下記の拡張機能を導入
２．ブラウザはグーグルクロームとほぼ同じで広告ブロックするbraveブラウザ使用
３．JSの実行不可モードに設定
４．CSSの埋め込みアドインソフトで下記のコードを登録
html
{
-webkit-touch-callout: auto !important;
-webkit-user-select: auto !important;
-khtml-user-select: auto !important;
-moz-user-select: auto !important;
-ms-user-select: auto !important;
user-select: auto !important;
-webkit-tap-highlight-color: rgba(0,0,0,0);
}
* {user-select: auto !important;
-webkit-user-select: auto !important;
-webkit-user-drag: auto !important;
}
.unselectable
{
-moz-user-select:auto !important;
-webkit-user-select:auto !important;
cursor: default;
}
5.下記のURLサイトを表示
https://fujiisouta.xyz/tag/ai%e5%bd%a2%e5%8b%a2%e5%88%a4%e6%96%ad
