日韩欧美国产wwwww,五月婷婷久久丁香,欧美黑人一区

編程（Programming）是編定程序的中文簡稱，就是讓計(jì)算機(jī)代碼解決某個(gè)問題，對(duì)某個(gè)計(jì)算體系規(guī)定一定的運(yùn)算方式，使計(jì)算體系按照該計(jì)算方式運(yùn)行，并最終得到相應(yīng)結(jié)果的過程。為了使計(jì)算機(jī)能夠理解（understand）人的意圖，人類就必須將需解決的問題的思路、方法和手段通過計(jì)算機(jī)能夠理解的形式告訴計(jì)算機(jī)，使得計(jì)算機(jī)能夠根據(jù)人的指令一步一步去工作，完成某種特定的任務(wù)。這種人和計(jì)算體系之間交流的過程就是編程。

【實(shí)例名稱】

隱藏式菜單

【實(shí)例描述】

菜單是網(wǎng)站的常用導(dǎo)航形式，為了保證頁面的整體效果，有時(shí)候需要將菜單隱藏起來。當(dāng)用戶需要的時(shí)侯再顯示出來。本例學(xué)習(xí)如何制作隱藏式菜單。

【實(shí)例代碼】

 
<html>
<head>
<TITLE>隱藏式菜單-本站（www.xue51.com）</title>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
</HEAD>
<BODY>
<SCRIPT language="javascript">
//狀態(tài)欄顯示信息
function MM_displayStatusMsg(msgStr) 
{ 
 status=msgStr;
 document.MM_returnValue = true;
}
//高亮顯示
function highlight(x)
{
document.forms[x].elements[0].focus()
document.forms[x].elements[0].select()
}
//菜單彈出時(shí)的處理
function MM_jumpMenu(targ,selObj,restore)
{ 
 eval(targ+".location='"+selObj.
options[selObj.selectedIndex].value+"'");
 if (restore) selObj.selectedIndex=0;
}
var NS;
IE=document.all;
NS=document.layers;
hdrFontFamily="Verdana";
hdrFontSize="2";
hdrFontColor="white";
hdrBGColor="#CCCCCC";
linkFontFamily="Verdana";
linkFontSize="2";
linkBGColor="white";
linkOverBGColor="#CCCCCC";
linkTarget="_top";
YOffset=60;
staticYOffset=20;
menuBGColor="#CCCCCC";
menuIsStatic="no";
menuHeader="主流索引"
menuWidth=150; 
staticMode="advanced"
barBGColor="#C0C0C0";
barFontFamily="Verdana";
barFontSize="2";
barFontColor="white";
barText="導(dǎo)航菜單";
//鼠標(biāo)移走時(shí)的菜單處理
function moveOut() 
{
if (window.cancel)
{ cancel="";}
if (window.moving2)
 { clearTimeout(moving2);
  moving2="";
  }
if ((IE && ssm2.style.pixelLeft<0)||(NS && document.ssm2.left<0)) 
{
 if (IE) {ssm2.style.pixelLeft += (5%menuWidth);
}
if (NS) 
{
 document.ssm2.left += (5%menuWidth);
}
moving1 = setTimeout('moveOut()', 5)
}
else {
 clearTimeout(moving1)
 }
};
function moveBack() {
 cancel = moveBack1()
}
function moveBack1() {
 if (window.moving1) {
 clearTimeout(moving1)
}
if ((IE && ssm2.style.pixelLeft>
(-menuWidth))||(NS && document.ssm2.left>(-150))) {
 if (IE) {ssm2.style.pixelLeft -= (5%menuWidth);
}
if (NS) {
 document.ssm2.left -= (5%menuWidth);
}
moving2 = setTimeout('moveBack1()', 5)}
 else {
 clearTimeout(moving2)
 }
};
lastY = 0;
//根據(jù)瀏覽器類型設(shè)置菜單模式
function makeStatic(mode) {
if (IE) {winY = document.body.scrollTop;var NM=ssm2.style
}
if (NS) {winY = window.pageYOffset;var NM=document.ssm2
}
if (mode=="smooth") {
 if ((IE||NS) && winY!=lastY) {
 smooth = .2 * (winY - lastY);
 if(smooth > 0) smooth = Math.ceil(smooth);
 else smooth = Math.floor(smooth);
 if (IE) NM.pixelTop+=smooth;
 if (NS) NM.top+=smooth;
 lastY = lastY+smooth;
}
setTimeout('makeStatic("smooth")', 1)
}
else if (mode=="advanced") {
 if ((IE||NS) && winY>YOffset-staticYOffset) {
 if (IE) {NM.pixelTop=winY+staticYOffset
 }
if (NS) {NM.top=winY+staticYOffset
 }
}
else {
 if (IE) {NM.pixelTop=YOffset}
 if (NS) {NM.top=YOffset-7 }
}
setTimeout('makeStatic("advanced")', 1)
 }
}
//根據(jù)瀏覽器類型初始化菜單
function init() {
if (IE) {
ssm2.style.pixelLeft = -menuWidth;
ssm2.style.visibility = "visible"
}
else if (NS) {
document.ssm2.left = -menuWidth;
document.ssm2.visibility = "show"
}
else {
alert('瀏覽器類型判斷錯(cuò)誤!')
}
}
//當(dāng)用戶選擇菜單時(shí)，在狀態(tài)欄提示導(dǎo)航地址
function MM_displayStatusMsg(msgStr) { 
 status=msgStr;
 document.MM_returnValue = true;
}
//判斷瀏覽器類型
if (IE) {document.write('<DIV ID="ssm2" 
style="visibility:hidden;Position : Absolute ;
Left : 0px ;Top : '+YOffset+'px ;Z-Index : 20;
width:1px" onmouseover="moveOut()" onmouseout="moveBack()">')}
if (NS) {document.write('<LAYER visibility="hide" top="'+
YOffset+'" name="ssm2" bgcolor="'+menuBGColor+'" left="0" 
onmouseover="moveOut()" onmouseout="moveBack()">')}
tempBar="";
for (i=0;i<barText.length;i++) {
tempBar+=barText.substring(i, i+1)+"<BR>"}
document.write('<table border="0" cellpadding="0" 
cellspacing="1" width="'+(menuWidth+16+2)+'" 
bgcolor="'+menuBGColor+'"><tr><td bgcolor="'+hdrBGColor+'" 
WIDTH="'+menuWidth+'"> <font face="'+hdrFontFamily+'" 
Size="'+hdrFontSize+'" COLOR="'+hdrFontColor+'"><b>'+
menuHeader+'</b></font></td><td align="center" rowspan="100" 
width="16" bgcolor="'+barBGColor+'"><p align="center">
<font face="'+barFontFamily+'" Size="'+barFontSize+'" 
COLOR="'+barFontColor+'"><B>'+tempBar+'</B></font></p></TD></tr>')
//添加菜單內(nèi)容項(xiàng)的方法
function addItem(text, link, target) 
{
if (!target) {target=linkTarget}
document.write('<TR><TD BGCOLOR="'+linkBGColor+'" 
onmouseover="bgColor=\''+linkOverBGColor+'\'" 
onmouseout="bgColor=\''+linkBGColor+'\'"><ILAYER>
<LAYER onmouseover="bgColor=\''+linkOverBGColor+'\'" 
onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="100%">
<FONT face="'+linkFontFamily+'" Size="'+linkFontSize+'"> 
<A HREF="'+link+'" target="'+target+'" CLASS="ssm2Items">'+
text+'</A></FONT></LAYER></ILAYER></TD></TR>')
}
//為菜單添加分類標(biāo)題的方法
function addHdr(text)
 {
 document.write('<tr><td bgcolor="'+hdrBGColor+'" WIDTH="140"> 
<font face="'+hdrFontFamily+'" Size="'+hdrFontSize+'" 
COLOR="'+hdrFontColor+'"><b>'+text+'</b></font></td></tr>')
 }
//下面是菜單內(nèi)容和指定的導(dǎo)航地址
addItem('初級(jí)搜索', 'http://www.google.com', '');
addItem('中級(jí)搜索', 'http://www.google.com', '');
addItem('搜索原理', 'http://www.google.com', '');
addItem('深入搜索', 'http://www.google.com', '');
addItem('垂直搜索', 'http://www.google.com', '_blank');
addHdr('幫助');  //菜單標(biāo)題
addItem('會(huì)員專屬論壇', 'http://www.google.com', '_blank');
document.write('<tr><td bgcolor="'+hdrBGColor+'">
<font size="0" face="Arial"> </font></td></TR></table>')
if (IE) {document.write('</DIV>')}
if (NS) {document.write('</LAYER>')}
if ((IE||NS) && (menuIsStatic=="yes"&&staticMode)) 
{makeStatic(staticMode);}
window.onload=init;
</SCRIPT>
本例中用到的樣式代碼如下所示：
<STYLE>
#ssm2 A 
{ FONT-SIZE: 12px; COLOR: #808080; FONT-FAMILY: verdana; TEXT-DECORATION: none}
#ssm2 A:hover
 { COLOR: #ccff33}
</STYLE>

</body>
</html>

【運(yùn)行效果】

隱藏式菜單運(yùn)行效果

【難點(diǎn)剖析】

本例中的主要方法是“addItem”和“addHdr”。“addItem”方法主要完成菜單項(xiàng)的添加，“addHdr”方法則為菜單添加分類標(biāo)題，如本例中的“主流索引”和“幫助”。本例中還需要注意的是如何判斷IE瀏覽器和非IE瀏覽器，因?yàn)獒槍?duì)不同瀏覽器的JaVaScript對(duì)象有所區(qū)別。

【源碼下載】

為了JS代碼的準(zhǔn)確性，請(qǐng)點(diǎn)擊：隱藏式菜單進(jìn)行本實(shí)例源碼下載

使用編程語言寫的程序，由于每條指令都對(duì)應(yīng)計(jì)算機(jī)一個(gè)特定的基本動(dòng)作，所以程序占用內(nèi)存少、執(zhí)行效率高。

溫馨提示：喜歡本站的話，請(qǐng)收藏一下本站！

人人做人人澡人人爽欧美,国产主播一区二区,久久久精品五月天,羞羞视频在线观看免费

當(dāng)前位置:蘿卜系統(tǒng)下載站 > 技術(shù)開發(fā)教程 > 詳細(xì)頁面

JS代碼完成隱藏式菜單效果

本類教程下載

系統(tǒng)下載排行