勉強したことのメモ

Webエンジニア / プログラマが勉強したことのメモ。

CSSとJavaScriptでテキストのコピー防止

   2024/04/17  JavaScript CSS

あるサイトで文言の意味が分からずGoogleで検索する為にコピペしようとするも、テキスト部分が選択できなかった。画像ではなくテキストで書かれているので不思議だったんだけど、調べてみるとCSSとJavaScriptでそのような対策ができるみたい。

 

ソースコード

<html>
<head>
<style>
body{
    user-select:none;
    -webkit-user-select:none;
    -moz-user-select:none;
    -khtml-user-select:none;
    -webkit-user-drag:none;
    -khtml-user-drag:none;
}
</style>
</head>
<body onMouseDown="return false;" onSelectStart="return false">
<div>
    ドラッグ不可能ドラッグ不可能ドラッグ不可能<br />
    ドラッグ不可能ドラッグ不可能ドラッグ不可能<br />
    ドラッグ不可能ドラッグ不可能ドラッグ不可能<br />
    ドラッグ不可能ドラッグ不可能ドラッグ不可能<br />
</div>
</body>
</html>

 - JavaScript CSS

  関連記事

CSSでfloatやmargin&widthは使わずにブロック要素の中央寄せ・右寄せする方法

CSSでブロック要素を中央寄せする場合はwidth指定しつつ「margin:0 ...

LINE風のふきだしデザイン

LINE風のふきだしデザインでページを作ってほしいと言われた。 CSSはあまり理 ...

「slick」でスライダー中央の下部にのみ指定したコンテンツを表示する方法

「slick」でスライダー画像の下部に何らかのコンテンツ(テキスト・リンク・別画 ...

CSSで一つの要素に対して複数の背景色を指定する方法

1つのdiv要素に対して複数の背景色をつけたかった。background-col ...

スマホサイトでviewportを指定しても横スクロールバーが表示される

スマホ用のサイトでviewportが指定されており、widthも100%になって ...