JavaScriptのエフェクトライブラリです。典型的な利用例はサンプルをご覧ください。
本ソフトは一部弘前大学総合情報処理センター研究開発費の補助を得て開発しました。
当初、本ソフトはNetscape社が公開していた "Drag and Drop Conponent" を参考に「ドラッグ＆ドロップライブラリ:dragable.js」として開発しました。Netscape社のページの旧URLは下記ですが、現在は閲覧できません。
本ソフトはフリーソフトです。再配布も改造も自由です。改造したソフトの配布は、そのことを明記して自由に行ってください。作者への連絡は不要です。でも、お気付きの点や改良された点を、作者にご連絡いただけるとうれしいです。
WindowsのIE6, IE7, FireFox2.0, NN7.1, NN4.78で動作を確認しています。
| effect.js | エフェクト ライブラリ(右クリックし、「対象をファイルに保存」してください) |
| index.htm | このページ |
それぞれリンクされているのでお試しください。また、どのようなプログラムになっているか「ソースを表示」してご覧ください。
effect.jsで利用できる機能とその使い方を下表にまとめました。
| プロパティまたはメソッド | 機能 |
|---|---|
| D=new Obj(x, y, html) D=putObj(x,y,html) |
(x,y)にObjのインスタンスを生成する |
| D.layer | DのレイヤID またはスタイルID |
| D.ondrop=function ... | Dのondropイベントハンドラ |
| D.onmove=function ... | Dのonmoveイベントハンドラ |
| D.ondrag=function ... | Dのondragイベントハンドラ |
| D.ondown=function ... | Dのdownイベントに対するイベントハンドラ |
| D.Width(W) | Dの幅をWにする |
| D.Height(H) | Dの高さをHにする |
| D.bgColor(color) | Dの背景色をcolorにする |
| D.dragable() | Dをドラッグ可能にする |
| D.show() | Dを見せる |
| D.hide() | Dを隠す |
| D.clip(x1,y1,x2,y2) | 相対座標(x1,y1),(x2,y2)でクリップする |
| D.bound(x1,y1,x2,y2) | Dの移動範囲を(x1,y1),(x2,y2)の範囲に制約する |
| D.bind(b) | Dをオブジェクトbにバインドする (bをドラッグするとDも移動する) |
| D.moveBy(x,y) | Dを(x,y)だけ移動する |
| D.moveBy(x,y,x1,y1,x2,y2) | 移動後のDを(x1,y1),(x2,y2)でクリップする |
| D.moveTo(x,y) | Dを(x,y)に移動する |
| D.forced(t) | Dがオブジェクトtの外周上にあった場合、tの内部/外部に移動する |
| D.inside(x,y) | 座標(x,y)がDの中にあればtrue、外にあればfalseを返す |
| D.width, D.height | Dの幅と高さ |
| D.x, D.y | Dの左上位置 |
| dstartX, dstartY | ドラッグ開始時のマウスポインタの位置 |
| droppedX, droppedY | ドロップ時のマウスポインタの位置 |
| D.Z | trueならばDをマウス操作した時に最も上のレイヤにする |
| D.wipein(1〜4) D.wipein(1〜4,s) |
Dをモード1〜4(順に左・右・上・下)から(s秒で)ワイプインする |
| D.wipeout(1〜4) D.wipeout(1〜4,s) |
Dをモード1〜4(順に左・右・上・下)へ(s秒で)ワイプアウトする |
| D.slidein(1〜4) D.slidein(1〜4,s) |
Dをモード1〜4(順に左・右・上・下)から(s秒で)スライドインする |
| D.slideout(1〜4) D.slideout(1〜4,s) |
Dをモード1〜4(順に左・右・上・下)へ(s秒で)スライドアウトする |
| D.slideBy(x,y) | Dを(x,y)だけスライドする |
| D.slideTo(x,y) | Dを(x,y)にスライドする |