2006.09.03 Sunday | 12:45

  JavaScript 汎用メニュー ふるいむかし

とりあえず完成

↓EUC で書いてます
http://winofsql.jp/lightboxmenu.js

実装方法はまず、メニューを作るコードを書く。

<SCRIPT language="JavaScript" src="http://winofsql.jp/lightboxmenu.js"></SCRIPT>

<SCRIPT language="JavaScript">

function LoadMenu() {

// オブジェクト作成
var Menu = new LMENU( "Unit1" );

// 基本部品の作成
Menu.Create( "http://hp.vector.co.jp/authors/VA003334/", "SQLの窓" );
// 位置指定
Menu.SetPosition( 400, 35 );
// 横項目追加
Menu.Add( "http://www.google.co.jp", "Links", "_blank" );
// 見栄え調整
Menu.AddEnd( 20 );
// 横一行の適用
Menu.ApplyBase();

// リストメニュー追加
Menu.AddColumn( 1, "http://winofsql.jp/enum/webclass/frame.htm", "Web Application Class" );
Menu.AddColumn( 1, "http://winofsql.jp/enum/cmaterial/frame.htm", "C 言語マテリアル" );
Menu.AddSpCol(1);

Menu.AddColumn( 2, "http://www.google.co.jp", "Google" );
Menu.AddColumn( 2, "http://dictionary.www.infoseek.co.jp/", "マルチ辞書" );
Menu.AddSpCol(2);

// メニュー全体の適用
Menu.Apply();

}

</SCRIPT>


そして、ページの最後で呼び出す
<SCRIPT for=window event=onload language=JavaScript>
LoadMenu();
</SCRIPT>


どんなにややこしいページでも、これで実装されると思います。
普通のページなら、BODY の onLoad で呼び出せば良いです。
あるいは、BODY タグの直後にスクリプトを埋め込んでも良いです。
( このページは DIV の扱いが複雑なので、最後に組み込んでます )

DOM で出来るだけ記述しました。
しかし、IE もネスケも DOM だけで書くのは無理のようです(^^;
また、たとえ書けてもクロスブラウジングが大変です。
特に、イベントの実装がかなり違いますね。


※ 動作確認は IE6.0 と Netscape 7.1