- Home
- JavaScript { Depository; }
- jQuery でなにかしらつくってみる
jQuery でなにかしらつくってみる
- 作成日 :
- 更新日 :
- 使用ライブラリ : jQuery
フローティングウィンドウ
- 使用プラグイン : EasyDrag jQuery Plugin
デモ
Window A
text text text text text text text text text text
Window B
text text text text text text text text text text
- フローティングウィンドウの仕様
- トリガーになるオブジェクトをクリックすることで、ウィンドウが出現
- ウィンドウはドラッグドロップが可能で、 Close ボタンを押す事で消える
- フローティングウィンドウの要件
- ページ読み込み後、 setFloating 関数を実行します。
- setFloating 関数内で、 トリガーとなるオブジェクトと出現させるウィンドウを指定
- ウィンドウを出現させる floating 関数の引数は、3つ（出現させるウィンドウの ID , X 軸の位置, Y 軸の位置）
- 第1引数は必須。第2、第3引数が指定されない場合、 X 軸の位置, Y 軸の位置は共に 50% に設定
スライダー
デモ
- スライダーの仕様
- トリガーになるオブジェクトにマウスオーバーすることで、写真が切り替わる
- スライダーの要件
- ページ読み込み後、 slider 関数を実行
- 変数 wide に写真の幅を、変数 number に写真の数を代入
ファイルの有無を確認してコンテンツの高さに応じてフレームの高さを動的に設定する
- 仕様
- iframe に読み込むファイルの有無を確認し、そのコンテンツの高さに応じて動的に iframe 高さを設定
- 要件
- ページ読み込み後、 createFrame.requestCheck 関数を実行
- createFrame.reqURI に iframe に読み込むファイルパスを代入
- createFrame.id に iframe を生成するブロックの id を代入