﻿//////////////////////////////////////////////////////////////////
//////              弹出菜单类，用于生成弹出二级菜单        //////    
//////                                                      //////
//////////////////////////////////////////////////////////////////  


/** 这里是菜单类的使用方法 **/



/** 首先创建菜单类的实例Poplist **/
var poplist = new Poplist();


/** 它有几个方法和属性，对它们进行设置 **/
/// 属性：
/// className:菜单的样式名 
/// parent:构成弹出菜单弹出因素的元素实例 

/// 方法：
/// addList(listText,listClassName):用来给弹出菜单添加子菜单项的。
/// listText:子菜单的显示文本。它也可以是一段html代码。
/// listClassName:子菜单所运用的样式名。
/// addArray(listItems,listClassName): 
/// listItems:包含有子菜单内容的数组。
/// listClassName:子菜单所运用的样式名。
/// clearList():清理所有子菜单。
/// listShow():开始显示列表。
/// listHidden():隐藏列表。


    function clearPop()
    {
        poplist.listHidde();
    }
    
    
    function MenuItem(itemText,className)
    {
        this.itemText = itemText;
        this.className = className;
    }
        
    
    function Poplist()
    {
        var objPop = document.getElementById("pop");
        //添加显示弹出菜单列表
        this.addList = function(listText,listClassName){
            objPop.innerHTML += "<li class='"+listClassName+"'>" + listText + "</li>";
        }
        
        //添加显示弹出菜单列表，可传一个数组
        this.addArray = function(listItems,listClassName){
            for(var i=0;i<listItems.length;i++)
            {
                poplist.addList(listItems[i],listClassName);
            }
        }
        
        //清楚显示弹出菜单列表
        this.clearList = function(){
            objPop.innerHTML = "";
        }
        
        this.displayList = function()
        {
            objPop.style.display="block";
        }
        
        //开始显示弹出菜单列表
        this.listShow = function(){
            //显示列表
            objPop.style.height="0px";
            objPop.style.top = 0 - this.parent.offsetHeight + 32 +"px";
            objPop.style.left = this.parent.offsetLeft +"px";
            this.displayList();
            if(objPop.innerHTML == "<LI class=popLeftClass></LI>\r\n<LI class=popRightClass></LI>")
            {
                this.listHidde();
            }
        }
        
        //开始隐藏弹出菜单
        this.listHidde = function(){
            objPop.style.display="none";
        }
        objPop.onmouseover = this.displayList;
        objPop.onmouseout = this.listHidde;
    }