function createFlyoutTable()
    {
        table = document.createElement("TABLE");
        table.className = "flyoutTable";
        tbody  = document.createElement("TBODY");
        row    = document.createElement("TR");

        tbody.appendChild(row);
        table.appendChild(tbody);
        document.body.insertAdjacentElement("afterBegin", table)

        this.addMainSeperator = addMainSeperator;
    }


    function createFlyout(headURL, headText, bgColor, fNum)
    {
        column = document.createElement("TD");
        column.className = "container";
        column.style.backgroundColor = bgColor;

        div = document.createElement("DIV");
        div.id = "flyout" + fNum;
        div.className = "flyout";
        div.style.backgroundColor = bgColor;

        link = document.createElement("A");
        link.className = "flyoutLink";
        link.href = headURL;
        link.appendChild(document.createTextNode(headText));

        column.appendChild(link);
        column.appendChild(div);
        row.appendChild(column);

        this.addItem = addItem;
        this.addSeperator = addSeperator;
        this.showMenu = showMenu;
        this.hideMenu = hideMenu;
        this.css = eval(div.id + ".style");

        this.css.left = column.offsetLeft;
        this.css.top = column.offsetTop + column.offsetHeight;

        if (fNum == 3 && (div.offsetLeft + table.offsetLeft + div.offsetWidth) > document.body.clientWidth)
            this.css.left = div.offsetLeft - ((div.offsetLeft + div.offsetWidth + table.offsetLeft) - document.body.clientWidth);

        column.onmouseover = new Function('showMenu(' + fNum + ')');
        column.onmouseout  = new Function('hideMenu(' + fNum + ')');
    }


    function addMainSeperator(bgColor)
    {
        column = document.createElement("TD");
        column.className = "container";
        column.align = "center";
        column.width = 9;
        column.style.backgroundColor = bgColor;

        column.appendChild(document.createTextNode("|"));
        row.appendChild(column);
    }


    function addSeperator()
    {
        seperator = document.createElement("DIV");
        seperator.className = "flyoutSep";

        div.appendChild(seperator);
    }


    function addItem(itemURL, itemText)
    {
        paragraph = document.createElement("P");
        paragraph.className = "flyoutText";

        link = document.createElement("A");
        link.className = "flyoutLink";
        link.href = itemURL;
        link.appendChild(document.createTextNode(itemText));

        paragraph.appendChild(link);
        div.appendChild(paragraph);
    }



    function showMenu(fNum)
    {
        flyout[fNum].css.visibility = "visible"
    }


    function hideMenu(fNum)
    {
        flyout[fNum].css.visibility = "hidden"
    }


    function initMenu()
    {
        flyout = new Array();

        flyoutTable = new createFlyoutTable();

        flyout[0] = new createFlyout('http://www.jubileehk.org/aboutus/', '禧福簡介', '#666666', 0);
        flyout[0].addItem('http://www.jubileehk.org/aboutus/index.html', '機構簡介');
        flyout[0].addSeperator();
        flyout[0].addItem('http://www.jubileehk.org/aboutus/director.html', '董事及同工團');
        flyout[0].addSeperator();
//        flyout[0].addItem('http://www.jubileehk.org/aboutus/vice.html', '副會長就職');
//        flyout[0].addSeperator();
        flyout[0].addItem('http://www.jubileehk.org/newsletter/index.html', '禧　訊');
        flyout[0].addSeperator();
        flyout[0].addItem('http://www.jubileehk.org/aboutus/hall.html', '禮堂租用');
        flyout[0].addSeperator();
//        flyout[0].addItem('http://www.jubileehk.org/aboutus/recruit.html', '招　聘');
//        flyout[0].addSeperator();
        flyout[0].addItem
('http://www.jubileehk.org/aboutus/donation.html', '奉獻支持');
        flyout[0].addSeperator();
        flyout[0].addItem('http://www.jubileehk.org/aboutus/contactus.html', '聯絡我們');
        flyoutTable.addMainSeperator('#666666');

        flyout[1] = new createFlyout('http://www.jubileehk.org/ministries/construct.html', '禧福事工', '#666666', 1);
        
        flyout[1].addItem('http://www.jubileehk.org/ministries/construct.html', '[基層事工]');
        flyout[1].addItem('http://www.jubileehk.org/ministries/construct.html', '地盤事工');
        flyout[1].addItem('http://www.jubileehk.org/ministries/ailian.html', '愛蓮事工');
        flyout[1].addItem('http://www.jubileehk.org/ministries/hairindus.html', '美髮業事工');
        flyout[1].addItem('http://www.jubileehk.org/ministries/poverty.html', '關懷貧窮事工');
        
        
        flyout[1].addItem('http://www.jubileehk.org/ministries/M9.html', 'M9 YEAH青事工');
        flyout[1].addSeperator();
        flyout[1].addItem('http://www.jubileehk.org/ministries/hawker.html', '[事工拓展部]');
        flyout[1].addItem('http://www.jubileehk.org/ministries/hawker.html', '小販事工');
        flyout[1].addItem('http://www.jubileehk.org/ministries/outdoor.html', '公園事工');
        flyout[1].addItem('http://www.jubileehk.org/ministries/elder.html', '天國耆兵使命團事工');
        flyout[1].addItem('http://www.jubileehk.org/training/elderly.html', '天國耆兵訓練課程');
        
        //flyout[1].addItem('http://www.jubileehk.org/ministries/glgrassroot.html', '主愛基層運動');
        //flyout[1].addSeperator();
        //flyout[1].addItem('http://www.jubileehk.org/ministries/renew.html', '[更新事工]');
        
        flyout[1].addSeperator();
        flyout[1].addItem('http://www.jubileehk.org/ministries/aoj.html', '喜樂兵團');

        flyout[1].addSeperator();
        flyout[1].addItem('http://www.jubileehk.org/ministries/overseas.html', '[海外事工]');
        flyout[1].addSeperator();
        flyout[1].addItem('http://www.jubileehk.org/product/booklet.html', '[出版事工]');

        flyoutTable.addMainSeperator('#666666');
        flyout[2] = new createFlyout('http://www.jubileehk.org/training/', '禧福學院', '#666666', 2);

flyout[2].addItem('http://www.jubileehk.org/training/courses.html', '課程一覽');   
     
flyout[2].addItem('http://www.jubileehk.org/training/wind.html', '乘風滑浪證書課程');
//flyout[2].addItem('http://www.jubileehk.org/training/onjob.html', '3W職場良牧文憑課程');

flyout[2].addItem('http://www.jubileehk.org/training/jifu_cert.html', '基鋒證書課程');

//flyout[2].addItem('http://www.jubileehk.org/training/jifu_dip.html', '基福神學文憑課程');

//flyout[2].addItem('http://www.jubileehk.org/training/pastoral.html', '教牧進修學位課程 ');

//flyout[2].addItem('http://www.jubileehk.org/training/mp.html', '宣教通行證文憑課程');



flyout[2].addItem('http://www.jubileehk.org/training/newarmy.html', '新力軍證書課程');
flyout[2].addItem('http://www.jubileehk.org/training/vision.html', '異象出擊課程');
        flyoutTable.addMainSeperator('#666666');

        flyout[3] = new createFlyout('http://www.jubileehk.org/training/', '國度學院', '#666666', 3);
        flyout[3].addItem('http://www.jubileehk.org/training/kingdomin_1.html', '課程介紹');
//        flyout[3].addItem('http://www.jubileehk.org/training/kingdomin_2.html', '課程大綱');
        flyout[3].addItem('http://www.jubileehk.org/training/kingdomin_2.html', '_學士課程');
        flyout[3].addItem('http://www.jubileehk.org/training/kingdomin_3.html', '_碩士先修班課程');


        flyoutTable.addMainSeperator('#666666');

        flyout[4] = new createFlyout('http://www.jubileehk.org/product/', '產   　品', '#666666', 4);
        flyout[4].addItem('http://www.jubileehk.org/product/index.html', '課程CD');
        flyout[4].addItem('http://www.jubileehk.org/product/booklet.html', '福音小冊子');
        flyoutTable.addMainSeperator('#666666');

        flyout[5] = new createFlyout('http://www.jubileehk.org/course/', '活動 / 課程', '#666666', 5);
        flyout[5].addItem('http://www.jubileehk.org/course/index.html', '最新課程');
        flyoutTable.addMainSeperator('#666666');

        flyout[6] = new createFlyout('http://www.jubileehk.org/course/', '     ', '#666666', 6);
        flyout[6].addItem('http://www.jubileehk.org/course/index.html', '     ');
    }

    window.onload = initMenu;