HTMLCanvasとJavaScriptで画像にウォーターマークを入れられる「watermark.js」
2011年04月02日-
スポンサード リンク
watermark.js | Image watermarks with HTMLCanvas and Javascript
HTMLCanvasとJavaScriptで画像にウォーターマークを入れられる「watermark.js」
ウォーターマークっていうのは、画像の著作権表示なんかを画像上に表示させてるやつです。
元画像はソースを開けばアドレスが直に書かれているのでバレてしまうのでプロテクションとしては弱いので注意が必要ですが、仕組みとしては面白いですね。
左上にうっすら水滴っぽいものが出ているのがウォーターマークです。
ウォーターマーク
元画像は以下。
ウォーターマーク用の画像を別途容易しておいて引数で渡してあげるという使い方です。
画像合成をブラウザ上でやっちゃう、という技術を利用しているので他にも応用が効きそうですね。
Firefox 3.6, Chrome, Opera 11, IE9に対応。
関連エントリ
HTMLCanvasとJavaScriptで画像にウォーターマークを入れられる「watermark.js」
ウォーターマークっていうのは、画像の著作権表示なんかを画像上に表示させてるやつです。
元画像はソースを開けばアドレスが直に書かれているのでバレてしまうのでプロテクションとしては弱いので注意が必要ですが、仕組みとしては面白いですね。
左上にうっすら水滴っぽいものが出ているのがウォーターマークです。
ウォーターマーク
元画像は以下。
ウォーターマーク用の画像を別途容易しておいて引数で渡してあげるという使い方です。
画像合成をブラウザ上でやっちゃう、という技術を利用しているので他にも応用が効きそうですね。
Firefox 3.6, Chrome, Opera 11, IE9に対応。
関連エントリ
スポンサード リンク
Advertisements
SITE PROFILE
最新のブログ記事(新着順)
- 小説表紙などに使えそうな商用可なフォント「になロマン」
- 筆で書いたようなカナ書体「筆竹仮名B」
- 無料・商用利用可な丸文字ピクセルフォント「マルミーニャM」
- スペースコブラ風フォント
- Next.jsのVercelから商用利用可能なフリー汎用フォント「Geist Font 」
- 無料で使えるいい感じの日本語フォント「しっぽり太ゴシック」
- CSSのみで実装された500種類のローディングアニメーション「CSS Loaders」
- 画像ホバーで様々なエフェクトをかけられる「Izmir」
- CSSのbox-shadowをGUIで生成できる「CSS Box Shadows Generator」
- 好きな画像や文字を埋め込んだQRコードをリアルタイムで作れるWEBツール
- 過去のエントリ