Home > javascript > floating Window

floating Window

  • Posted by: daniwell
  • 2008年7月25日 18:19
  • javascript

なんかこう、HTMLの上に重なって表示されるFlashなど(のブログパーツ)をよく見かけるので
自分でも作ってみた(いちおう使い易いものを目指して)。

あんまりJavaScriptは触らないせいか、やや苦戦。
かなり汚いコードになってしまった気がするが、そこら辺は徐々に修正するか。

以下「生成する。」をクリックで、
ランダムな位置にFlashが挿入されます。

生成する。

 
[source: floatingWindow.js ]

以下、使い方簡易まとめ。

まず、大まかな流れとしては、

  • floatingWindow.jsを読み込む
  • JavaScriptでObject作成
  • 各種パラメータを設定( Object.url="flash,swf" 等という風に)
  • 関数 floatingWindow(Object) を呼び出し

続いて具体的な記述例と補足。

object = new Object();

// ----- 各種パラメータ -----
object.url = "URL" (省略不可);
// Flash(.swf)以外に画像ファイルでもOK
object.id = "ID" (省略時 URLをもとに生成);
object.width = "ヨコ幅" (省略時 500px);
object.height = "タテ幅" (省略時 500px);
// ヨコ幅、タテ幅は"%"をつけるとウィンドウに対する割合になる
object.top = "y 座標" (省略時 中央に表示);
// 数値で入力する以外には、"t"(上部), "c"(中央), "b"(下部) がある
object.left = "x 座標" (省略時 中央に表示);
// 数値で入力する以外には、"l"(左端), "c"(中央), "r"(右端) がある

object.url_bg = "背景画像URL" (省略時 背景画像なし);
object.id_bg = "背景ID" (省略時 IDをもとに生成);
object.bgc = "背景色" (省略時 背景色なし);
// 背景はウィンドウ全体に表示される

object.zindex = "階層" (省略時 1000);
object.sc = "スクロール有無" (省略時 false);
// ブラウザのスクロールに追随するかどうか、ということ(true or false)
object.cl = "×ボタン有無" (省略時 false);
// 閉じるボタンを表示するかどうか、ということ 位置は下部中央(true or false)

object.param = new Array();
object.param = [ "各種埋め込みパラメータ" ] (省略時 なし);
// 例) flashの場合、object.param = [ "wmode", "transparent", "bgcolor", "#FFFFFF" ]; など

floatingWindow(object);

とまあ、いろいろパラメータがあってややこしい感じもするんだけれど、
基本的にURL以外は省略可能なので、短く書こうと思えば結構短く書ける。

// 例) flash.swf(ヨコ:320px,タテ:240px)をウィンドウ中央に表示
object = new Object();

object.url = "flash.swf";
object.width = 320;
object.height = 240;

floatingWindow(object);

あと、floatingWindow(object) を実行することで表示・非表示を切り替えることが出来ます。

Comments:0

Comment Form

Trackbacks:0

TrackBack URL for this entry
http://www.papiness.com/blog/mt-tb.cgi/53
Listed below are links to weblogs that reference
floating Window from papi-blo

Home > javascript > floating Window

Search
Feeds

Return to page top