Class

Webサイト上にあるコンテンツのコピーを出来なくさせるプラグインを書いてみた。
Ajaxと併用するといい感じ。

ロジックは以下：

1. 透過画像をbody全体に被せる（オプション:cover）
2. oncopy を return false;
3. Ctrl+AとCtrl+Cを無効にする
4. B：前に戻る N：次に進む（オプション:move）

主な弱点と対策：

• メニューから選ぶ「すべて選択」「コピー」
  →メニューやステータスバーを消した別窓に表示
• ファイルへの直アクセス
  →アクセス制限、データベースの使用
• ソース表示
  →この記事やこの記事のようにデータベースやデータファイルからXHRでコンテンツを得る
  →jsファイルの難読化

window.openで表示

普通に表示

いずれも開発者ツールには無力です。
Ajax中心でいろいろ考えてみたけど、やっぱり画像にしたりFlash使うのが最強なのかな。
HTML5環境であればCanvasを使用するのがいいかもしれない。

Continue reading

MooToolsとCSSでFlashのような滑らかなマウスオーバーやカレント表示を実装するプラグイン。

元ネタはCreate a Sprited Navigation Menu Using CSS and MooToolsで、
よくやるコーディングに合わせて作り直しつつちょっとロジックを変えてクラス化した。
使用する際にはHTMLとCSSにいくつかルールがあります。

DEMOはこちら

Image

全部つなげて作る。順番はなんでもいいです。
デモのやつは上から、通常・マウスオーバー・クリック・カレント、になってます。

Download(psd file):SpriteNavigation Demo Base (v1.0)

Continue reading

mooZoomGalleryはサムネイル画像から拡大画像への表示を、画像が並んでいるエリア内で行うMooTools用ギャラリープラグインです。
LightBoxのようにレイヤーを被せて表示するのではなく、他のサムネイルを非表示にする事で画像を表示する場所を確保します。
……なんかこの動きどこかで見たような気がしなくもないですが、
このプラグインは全て同じサイズのサムネイル画像を並べたレイアウトに特化しています。

View Demo

Continue reading

mooContreGalleryはhttp://www.contreforme.ch/のProjectsページで使われている
画像拡大、スクロール、インフォメーション表示など一連のエフェクトを貴方のサイトに実装するプラグインです。
本家サイトの動きをClass化＋最新バージョンに対応させつつ再現したものですが、
オプションを変更する事によってエフェクトをお好みにアレンジすることが出来ます。

View Demo

当プラグインの公開についてはcontreforme sàrlの中の人に許可を頂きました。
This class original source created from contreforme sàrl. Thank you!

また、このプラグインは「これどうやって作るの？」という質問がきっかけで出来たものです。
jQueryではやる気が出ず、MooToolsでの回答になりましたが(笑)質問を送ってくれたH氏にも感謝！
チュートリアル記事はこちら »

Continue reading

何となく思いつきだけで作ってみたっ…！
このプラグインは、ページに「ざわ…」を延々表示し続ける…たったそれだけの機能しかない…！

直接見る »

おっと……忘れるところだった………
一度しか言わない……　このプラグインはmootools ver1.2 が必要だ…
jQueryとprototype.jsでの作成は検討していない…が、要望があったら作る…かもしれないっ…

ダウンロード：Zawazawa

Continue reading