右クリックコピーを防止して画像を貼るには
〜透過色画像とtableタグを利用する〜

今回のお題
touka.png + main.jpg + tableタグ。

この方法だと、右クリックで
・画像保存する
・ファイルパスを取得して直リンする
ことを防げます。
注)ただし、完全に画像のコピーを防ぐことはできません。
どんな方法でもパソコンの画面に画像が表示される時点でコピーできますが、
お手軽に画像を利用されることは少なくなると思います。


材料


a.透過色処理ができるフォトレタッチソフトやお絵かきソフト
b.貼り付けたい画像ファイル(jpg,png,gif...)
c.上と縦横の寸法が同じサイズの透過色画像(↓で作ります。pngかgif)
d.tableタグ(↓で作ります)

貼り付けたい画像ファイル main.jpg これが透過色画像 touka.png

画像ファイルの準備


・b.の画像ファイルのサイズを調べます。a.のソフトで開けばわかるはず。
 サイズの単位はピクセル(px)で。今回のmain.jpgは320×240ピクセル。

・a.のソフトの[新規作成]などで、上で調べたのと同じサイズの画像を作ります。
 色は何でもok。今回のtouka.pngは黒一色。
・画像を作ったら、透過色指定を行います。
・透過色指定を行ったら保存します。これでc.のtouka.pngファイルが出来上がり。

画像をアップしてタグ追加


・b.とc.をアップロードします。gaiaxの画像アップローダを使えばできるかな・・・
・tableタグを作ります。以下をコピーして、見せたい画像透過色画像を、それぞれのファイル名に変更します。
 URL上のディレクトリが違うとき、画像ファイルは相対パスで入力します。

・最後にgaiaxにログインして、メインページのお知らせに上で作ったtableタグを入れます。
 改行の選択は、タグを使うのでマニュアル改行にします。
 今まで自動改行をしていたら、改行したいところで<BR>タグを追加しないと改行されないので注意!!

これで上手く見せたい画像が表示されて、右クリックのプロパティで透過画像のファイル名が出れば完了!

実際にどうなっているかは、(IEの場合)右クリックしてこのファイルの[ソースを表示]で見てみましょう。

更新履歴

2004.6.3? 新規作成
2004.7.18 URL移動してリファイン