导航栏

<div id="index_head">
   <div id="tou">

   </div>

   <div id="menu">
      
      <div id="menu_a">
         <div class="list" onmouseover="show('xizang')" onmouseout="hide('xizang')">
         <a href="xibeifengguang.html">西藏</a>
         </div>
            <div class="erji">
               <div class="erwai" id="xizang" onmouseover="xianshi(this)" onmouseout="yincang(this)">
               <div class="item">
               <a href="linzhi.html"> 林芝</a>
               </div>
               <div class="item">
               <a href="budalagong.html">布达拉宫</a>
               </div>
               <div class="item">
               <a href="namucuo.html">纳木错</a>
               </div>
            </div>
         </div>
         <div class="list" onmouseover="show('qinghai')" onmouseout="hide('qinghai')">
         <a href="xibeifengguang.html">青海</a>
         </div>
            <div class="erji">
               <div class="erwai" id="qinghai" onmouseover="xianshi(this)" onmouseout="yincang(this)">
               <div class="item">
               <a href="qinghaihu.html">青海湖</a>
               </div>
               <div class="item">
               <a href="nianbaoyuze.html">年宝玉则</a>
               </div>
            </div>
         </div>
         <div class="list" onmouseover="show('gansu')" onmouseout="hide('gansu')">
         <a href="xibeifengguang.html">甘肃</a>
         </div>
            <div class="erji">
               <div class="erwai" id="gansu" onmouseover="xianshi(this)" onmouseout="yincang(this)">
               <div class="item">
               <a href="jiayuguan.html">嘉峪关</a>
               </div>
               <div class="item">
               <a href="danxia.html">张掖丹霞</a>
               </div>
               <div class="item">
               <a href="mingshashan.html">鸣沙山</a>
               </div>
               <div class="item">
               <a href="mogaoku.html">莫高窟</a>
               </div>
            </div>
         </div>
         <div class="list" onmouseover="show('xinjiang')" onmouseout="hide('xinjiang')">
         <a href="xibeifengguang.html">新疆</a>
         </div>
            <div class="erji">
               <div class="erwai" id="xinjiang" onmouseover="xianshi(this)" onmouseout="yincang(this)">
               <div class="item">
               <a href="tianshan.html">天山天池</a>
               </div>
               <div class="item">
               <a href="kanasi.html">喀纳斯湖</a>
               </div>
               <div class="item">
               <a href="nalati.html">那拉提</a>
               </div>
            </div>
         </div>
      
      
      
      </div>
      
   </div>

</div>

window.onscroll = function(){
    if(window.scrollY>=200){
        document.getElementById("menu").style.position = "fixed";
        document.getElementById("menu").style.top = "0px";
    }else{
        document.getElementById("menu").style.position = "";
    }
}

function show(id){
    var d = document.getElementById(id);
    d.style.display = "block";
}

function hide(id){
    var d = document.getElementById(id);
    d.style.display = "none";
}

function xianshi(d){
    d.style.display = "block";
}
function yincang(d){
    d.style.display = "none";
}

 

转载于:https://www.cnblogs.com/jgjk/p/7106914.html