📄 13-9.txt

📁 开发王代码代码
💻 TXT
字号:
<head>
<style>
<!--与前面相同
-->
</style>
</head>
<body onmousemove="closeAllSubItem(event);">
<div id="headerNav">
  <div id="mainNav">
    <div id="mainItem1" class="mainItem"
             onmouseover="displaySubItem(this);">开发王</div>
	<div id="mainItem2" class="mainItem"
             onmouseover="displaySubItem(this);">最佳拍档</div>
	<div id="mainItem3" class="mainItem"
             onmouseover="displaySubItem(this);">Flash</div>
	<div id="mainItem4" class="mainItem"
             onmouseover="displaySubItem(this);">简体中文</div>
	<div id="mainItem5" class="mainItem"
             onmouseover="displaySubItem(this);">繁体中文</div>
	<div id="mainItem6" class="mainItem"
             onmouseover="displaySubItem(this);">其它语言</div>
  </div>
  <div id="subMenu" class="subItemNav"></div>
</div>
<br /><br /><br /><br />
<script type="text/javascript">
<!--
//--------------------[01]-----------------------------------------
//初始化，
//变量totalItems表示共有多少个主菜单项
var totalItems = 6;
var subMenu1="";
subMenu1 += '<a href="#">HTML</a> | ';
subMenu1 += '<a href="#">CSS</a> | ';
subMenu1 += '<a href="#">JavaScript</a> | ';
subMenu1 += '<a href="#">ASP</a> | ';
subMenu1 += '<a href="#">ASP.NET(VB)</a> | ';
subMenu1 += '<a href="#">ASP.NET(C#)</a> | ';
subMenu1 += '<a href="#">JSP</a> | ';
subMenu1 += '<a href="#">PHP</a>';
var subMenu2="";
subMenu2 += '<a href="#">HTML/CSS/JavaScript</a> | ';
subMenu2 += '<a href="#">ASP</a> | ';
subMenu2 += '<a href="#">ASP.NET(VB)</a> | ';
subMenu2 += '<a href="#">ASP.NET(C#)</a> | ';
subMenu2 += '<a href="#">JSP</a> | ';
subMenu2 += '<a href="#">PHP</a>';
var subMenu3="";
subMenu3 += '<a href="#">动画王</a> | ';
subMenu3 += '<a href="#">开发王</a> | ';
subMenu3 += '<a href="#">FMS</a> | ';
subMenu3 += '<a href="#">Flash Player：The Missing Manual</a> | ';
subMenu3 += '<a href="#">ASP.NET for Flash</a> | ';
subMenu3 += '<a href="#">ASP for Flash</a> | ';
subMenu3 += '<a href="#">JSP for Flash</a> | ';
subMenu3 += '<a href="#">PHP for Flash</a>';
var subMenu4="";
subMenu4 += '<a href="#">some link</a> | ';
subMenu4 += '<a href="#">some link</a>';
var subMenu5="";
subMenu5 += '<a href="#">some link</a> | ';
subMenu5 += '<a href="#">some link</a>';
var subMenu6="";
subMenu6 += '<a href="#">some link</a> | ';
subMenu6 += '<a href="#">some link</a>';
function init(){ 
  //获取子菜单项div元素，并设置其内容
  var oSubItem = document.getElementById("subMenu");
  oSubItem.style.visibility = "hidden"
  oSubItem.innerHTML = "";
  for (var i=1; i<= totalItems; i++){
    //获取所有主菜单项div元素，并设置其样式，主要就是初始化定位
	var oMainItem = document.getElementById("mainItem"+i);
    oMainItem.style.left = 74*i+"px";
  }
}
init();
//--------------------[02]-----------------------------------------
//鼠标指针移到主菜单项上方，触发该函数
//该函数重新设置主菜单项和子菜单项
function displaySubItem(theobj){
  for (var i=1; i<= totalItems; i++){
	var oMainItem = document.getElementById("mainItem"+i);
	oMainItem.style.backgroundImage = "url(pic/tab1.gif)";
  }
  var oSubItem = document.getElementById("subMenu");
  var mainItemIndex = theobj.getAttribute("id").toString().substring(8);
  oSubItem.style.visibility="visible";
  oSubItem.innerHTML = eval("subMenu"+mainItemIndex);
  theobj.style.backgroundImage = "url(pic/tab2.gif)";
}				
//--------------------[03]-----------------------------------------
//鼠标指针移动时，触发该函数
//注意对象变量scopeY用于定义垂直方向上的范围，这里是从5-60
//表示主菜单项和子菜单项的范围
//该函数检查鼠标指针是否超出这个范围，从而重新设置子菜单项
function closeAllSubItem(event){
  var scopeY = {top:5,bot:60};
  window.status=event.clientY;
  if ((event.clientY<scopeY.top)||(event.clientY>scopeY.bot)){
    var oSubItem = document.getElementById("subMenu");
	oSubItem.style.visibility = "hidden";
	oSubItem.innerHTML = "";
  }
}
-->
</script>
</body>
⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -