导航JavaScript

window.onload=function(){
    var Hnav=document.getElementById('Hnav');
    var HNindex=document.getElementById('HNindex');
    var HNindexImg=HNindex.getElementsByTagName('img')[0];
    var aHLi=Hnav.getElementsByTagName('li');
    var aHNavA=Hnav.getElementsByTagName('a');
    var aHNav=[];
    for(var i=0;i<aHLi.length;i++){
        if(aHLi[i].className=="HnavText"){
            aHNav.push(aHLi[i]);
        }
    }
//--------------------------------------------------------  
        HNindex.style.width=aHNav[0].offsetWidth+'px';
        HNindexImg.style.left=(HNindex.offsetWidth-HNindexImg.offsetWidth)/2+'px';
    for(var i=0;i<aHNav.length;i++){
        aHNav[i].index=i;       
        aHNav[i].onmouseover=function(){
            for(var i=0;i<aHNavA.length;i++){
                aHNavA[i].className='';
            }
            aHNavA[this.index].className='HNActive';
            HNindex.style.width=aHNav[this.index].offsetWidth+'px';
            HNindexImg.style.left=(HNindex.offsetWidth-HNindexImg.offsetWidth)/2+'px';
            HNHC(HNindex,aHNav[this.index].offsetLeft);
        };

    }

    var HNTime=null;
    function HNHC(obj,target){
        clearInterval(HNTime);
        HNTime=setInterval(function(){
            var speed=(target-obj.offsetLeft)/10;
            speed=speed>0?Math.ceil(speed):Math.floor(speed);
            if(target==obj.offsetLeft){
                clearInterval(HNTime);
            }
            else{
                obj.style.left=obj.offsetLeft+speed+'px';
            }
        },20);
    }
//--------------------------------------------------------------------------------
    var TopFun=document.getElementById('TopFun');
    var target_city=document.getElementById('target_city');
    var TopFunDd=TopFun.getElementsByTagName('dd');
    var qiehuan=document.getElementById('qiehuan');
    var Citylist=document.getElementById('Citylist');
    var CitylistA=Citylist.getElementsByTagName('a');
    var aCity=[];
    for(var i=0;i<TopFunDd.length;i++){
            aCity.push(TopFunDd[i]);
    }
    for(var i=0;i<CitylistA.length;i++){
        aCity.push(CitylistA[i]);
    }
    for(var i=0;i<aCity.length;i++){
        aCity[i].onclick=function(){
            target_city.innerHTML=this.innerHTML
        };
    }
//  alert(aCity.length);
    qiehuan.onmouseover=function(){
        Citylist.style.display='block';
    };
    qiehuan.onmouseout=function(){
        Citylist.style.display='none';
    };



}