设为首页 加入收藏
当前位置:首页 > 整站内容 > 特效代码 > 导航特效 > 详细内容
滑出式菜单
发布时间:2010-3-19  阅读次数:8679  字体大小: 【】 【】【

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>网页特效|Linkweb.cn/Js|---滑出式菜单</title>
<style>
<!--
#ssm2 A {
  color:black;
  text-decoration:none;
  font-size:12;
  font-family:verdana;
  }

#ssm2 A:hover {
  color:red;
   }


-->
</style>
</head>

<body>

<script language="JavaScript">
  
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()
}
  
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="#666666";
linkFontFamily="Verdana";
linkFontSize="2";
linkBGColor="white";
linkOverBGColor="#CCCCCC";
linkTarget="_top";
YOffset=60;
staticYOffset=20;
menuBGColor="black";
menuIsStatic="no";
menuHeader="大类菜单1"
menuWidth=150; // Must be a multiple of 5!
staticMode="advanced"
barBGColor="#1298fd";
barFontFamily="Verdana";
barFontSize="2";
barFontColor="white";
barText="滑出式菜单";
  
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;
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)
  }
}
  
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('Choose either the "smooth" or "advanced" static modes!')
}
}
  
  
function MM_displayStatusMsg(msgStr) {  
   status=msgStr;
   document.MM_returnValue = true;
}
</script>
  
<script language="JavaScript">
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>')
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>')}
function addHdr(text) {
document.write('<tr><td bgcolor="'+hdrBGColor+'" WIDTH="140"> <font face="'+hdrFontFamily+'" Size="'+hdrFontSize+'" COLOR="'+hdrFontColor+'"><b>'+text+'</b></font></td></tr>')}
  
//Only edit the script between HERE
  
addItem('     小类菜单1', '#', '_blank');
addItem('     小类菜单2', '#', '_blank');
addItem('     小类菜单3', '#', '_blank');
addItem('     小类菜单4', '#', '_blank');
addItem('     小类菜单5', '#', '_blank');
addItem('     小类菜单6', '#', '_blank');
addHdr('大类菜单2');
addItem('     小类菜单1', '#', '_blank');
addItem('     小类菜单2', '#', '_blank');
addItem('     小类菜单3', '#', '_blank');
addItem('     小类菜单4', '#', '_blank');
addItem('     小类菜单5', '#', '_blank');
addItem('     小类菜单6', '#', '_blank');
  
  
// and HERE! No more!
  
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);}
  
</script>
<script>
window.onload=init
</script>
  
</body>
</html>

预览效果

天猫商城    聚划算    天猫电器城    淘宝旅行    天猫超市    淘宝游戏    天猫品牌特卖    天猫母婴

我要评论
  • 匿名发表
  • [添加到收藏夹]
  • 发表评论:(匿名发表无需登录,已登录用户可直接发表。) 登录状态:未登录
最新评论
所有评论[2]
  • 评论人:[匿名] 时间: [2018-8-23 0:42:12] IP:[93.189.207.13*]
  • здесь на вышеприведенном интернет-ресурсе [url=http//www.vuz-chursin.ru/]http//www.vuz-chursin.ru/[/url] собран большой набор последних новостей о строительстве.
  • 评论人:[匿名] 时间: [2018-8-9 9:55:29] IP:[109.194.99.10*]
  • у нас на вышеприведенном интернет-ресурсе [url=http//da-hostel.ru/]http//da-hostel.ru/[/url] подобран огромный выбор статей о туризме.

全站链接: 
收录查询
分享按钮