注册 | 登陆

您的位置：阿里西西 > 网页特效 > 导航菜单 > 详细内容

0顶

隐藏在页面左侧的导航菜单

稿源：互联网 2022-06-28 19:22:46 点击： 2072 撤稿纠错

点击后才慢慢弹出隐藏在左侧的导航菜单，漂亮实用，可自定义。

以下讨论的是和相关的隐藏在页面左侧的导航菜单教程文章，内容是本站精心挑选整理的教程，希望对广大的网友给到帮助,下面是详细内容：

脚本代码(For Alixixi.com)如下:

<style>
#divMenu {font-family:arial,helvetica; font-size:12pt; font-weight:bold}
#divMenu a{text-decoration:none;}
#divMenu a:hover{color:red;}
</style>
<script language="JavaScript1.2">
ie=document.all?1:0
n=document.layers?1:0
lshow=34
var move=10;
//At what speed (in milliseconds, lower value is more speed)
menuSpeed=40
//Do you want it to move with the page if the user scroll the page?
var moveOnScroll=true
var tim;
var ltop;
//Object constructor
function makeMenu(obj,nest){
    nest=(!nest) ? '':'document.'+nest+'.'
    this.css=(n) ? eval(nest+'document.'+obj):eval(obj+'.style')
this.state=1
this.go=0
this.width=n?this.css.document.width:eval(obj+'.offsetWidth')
this.left=b_getleft
    this.obj = obj + "Object"; eval(this.obj + "=this")
}//欢迎来到站长特效网，我们的网址是www.zzjs.net，很好记，zz站长，js就是js特效，本站收集大量高质量js代码，还有许多广告代码下载。
//Get's the top position.
function b_getleft(){
var gleft=(n) ? eval(this.css.left):eval(this.css.pixelLeft);
return gleft;
}
function moveMenu(){
if(!oMenu.state){
clearTimeout(tim)
mIn()
}else{
clearTimeout(tim)
mOut()
}
}
//Menu in
function mIn(){
if(oMenu.left()>-oMenu.width+lshow){
oMenu.go=1
oMenu.css.left=oMenu.left()-move
tim=setTimeout("mIn()",menuSpeed)
}else{
oMenu.go=0
oMenu.state=1
}
}//欢迎来到站长特效网，我们的网址是www.zzjs.net，很好记，zz站长，js就是js特效，本站收集大量高质量js代码，还有许多广告代码下载。
//Menu out
function mOut(){
if(oMenu.left()<0){
oMenu.go=1
oMenu.css.left=oMenu.left()+move
tim=setTimeout("mOut()",menuSpeed)
}else{
oMenu.go=0
oMenu.state=0
}
}//欢迎来到站长特效网，我们的网址是www.zzjs.net，很好记，zz站长，js就是js特效，本站收集大量高质量js代码，还有许多广告代码下载。
/********************************************************************************
Checking if the page is scrolled, if it is move the menu after
********************************************************************************/
function checkScrolled(){
if(!oMenu.go) oMenu.css.top=eval(scrolled)+ltop
if(n) setTimeout('checkScrolled()',30)
}
/********************************************************************************
Inits the page, makes the menu object, moves it to the right place,
show it
********************************************************************************/
function menuInit(){
oMenu=new makeMenu('divMenu')
scrolled=n?"window.pageYOffset":"document.body.scrollTop"
oMenu.css.left=-oMenu.width+lshow
ltop=(n)?oMenu.css.top:oMenu.css.pixelTop;
oMenu.css.visibility='visible'
if(moveOnScroll) ie?window.onscroll=checkScrolled:checkScrolled();
}
//Initing menu on pageload
onload=menuInit;
</script>
<a href="<#ZC_BLOG_HOST#>">站长特效网</a>,站长必备的高质量网页特效和广告代码。zzjs.net，站长js特效。<hr>

<div id="divMenu" style="position:absolute; top:250; left:30; width:260; visibility:hidden; background-color: #00FFFF">
<nobr>
<a href="http://www.zzjs.net">站长特效网</a> -
<a href="<#ZC_BLOG_HOST#>?cat=1">zzjs</a> -
<a href="<#ZC_BLOG_HOST#>?cat=2">网页特效</a> -
<a href="<#ZC_BLOG_HOST#>?cat=11">广告代码</a> -
<a href="http://www.alixixi.com/">阿里西西</a> -
<a href="http://www.baidu.com/">百度</a> -
<a href="http://www.google.com/">谷歌</a> -
<a href="javascript://" onclick="moveMenu()" style="background-color:yellow;text-decoration:none">菜单</a>
</nobr>
</div>

关于隐藏在页面左侧的导航菜单的内容写到这里就结束啦，您可以收藏本页网址https://js.alixixi.com/a/2016329862670.shtml方便下次再访问哦。

·上一篇： 鼠标经过弹出提示层信息效果
·下一篇： 导航菜单隐藏效果

相关阅读

文章分类LIST >>返回首页

排行总榜

避免你的邮箱地址被自动收集的代码
有趣的按钮
控制用按钮打开新窗口的属性
单击按钮或图片打开IE首页
点击按钮打印该页
仿软件浮动按钮
在规定时间内方有效的按钮
一个按钮完成对文本框内容的复制
按钮选中文本框内所有内容
Windows式样的按钮

最新游戏

更多 »

最新新闻

更多 »