﻿
function CityMenu(c) {
    this.getObjTop = function(e) {
        var t = e.offsetTop;
        while (e = e.offsetParent) {
            t += e.offsetTop;
        }
        return t;
    }
    
    this.getObjLeft = function(e) {
        var l = e.offsetLeft;
        while (e = e.offsetParent) {
            l += e.offsetLeft;
        }
        return l;
    }

    this.getStyle = function(){
        var str = "";
        str += '<style type="text/css">';
        str += '.div_city { position:absolute; border:1px solid #7DB7EA; background:#E9F3FF; padding:5px; width:400px; }';
        str += '.div_item { padding:5px; width:55px; font-size:12px; float:left; color:#ffffff; font-weight:normal; }';
        str += '.div_item a{width:53px;height:23px;background:url(ima/xm2.gif) 2px 0px no-repeat;line-height: 26px;color:#ffffff; display:block;text-align:center;}';
        str += '.div_item a:hover{width:53px;height:23px;background:url(ima/xm1.gif) 2px 0px no-repeat;line-height: 26px;color:#ffffff; display:block;text-align:center;}';
        str += '</style>';
        return str;
    }

    this.toString = function() {
        var arrCity = new Array();
        arrCity[0] = "<a href='search.asp?area=重庆'>重庆</a>";
        arrCity[1] = "<a href='search.asp?area=天津'>天津</a>";
        arrCity[2] = "<a href='search.asp?area=安徽'>安徽</a>";
        arrCity[3] = "<a href='search.asp?area=福建'>福建</a>";
        arrCity[4] = "<a href='search.asp?area=广东'>广东</a>";
        arrCity[5] = "<a href='search.asp?area=广西'>广西</a>";
        arrCity[6] = "<a href='search.asp?area=重庆'>重庆</a>";
        arrCity[7] = "<a href='search.asp?area=天津'>天津</a>";
        arrCity[8] = "<a href='search.asp?area=安徽'>安徽</a>";
        var str = "";
        str += this.getStyle();
        str += '<div class="div_city" id="divCityMenu" style="display:none;z-index:1000;" onmouseover="this.style.display=\'\'" onmouseout="this.style.display=\'none\'">';
        for (var i = 0; i < arrCity.length; i++) {
            str += '<div class="div_item">' + arrCity[i] + '</div>';
        }
        str += '</div>';
        return str;
    }

    this.show = function(e) {
        var divCityMenu = document.getElementById("divCityMenu");
        divCityMenu.style.top = (this.getObjTop(e) + 18) + "px";
        divCityMenu.style.left = (this.getObjLeft(e) - 360) + "px";
        divCityMenu.style.display = "";
    }

    this.hid = function() {
        var divCityMenu = document.getElementById("divCityMenu");
        divCityMenu.style.display = "none";
    }
}

var cityMenu = new CityMenu('cityMenu');
document.write(cityMenu);
