js控制菜单栏显示与隐藏切换效果

通过js来控制菜单栏显示与隐藏切换显示特效，当用户鼠标点击链接按钮即可实现切换显示，根据自己的需求来自定义。

<style>
#menushow_www_wuming_ren{
border: 1px solid #999999;
background-color: #cccccc;
padding: 0px;
font-size: 10px;
font-family: tahoma;
position: absolute;
width: 161px;
height: auto;
}
#menuselect_wwwwumingren{
border: 1px solid #999999;
background-color: #cccccc;
padding: 0px;
font-size: 10px;
font-family: tahoma;
position: absolute;
width: 161px;
height: 24px;
}
a {  font-family: "tahoma"; font-size: 10px; line-height: 16px; color: #333333; text-decoration: none}
a:hover {  font-family: "tahoma"; font-size: 10px; line-height: 16px; color: #FFFFFF; text-decoration: none}
</style>
<div id="menuselect_wwwwumingren" style=""> <a href="#" onClick="onmenu_wwwwumingren();off_www_wuming_ren()">
<img src="/img/20240418_www_wuming_ren_3.gif" width="161" height="24" border="0" /></a></div>
<div id="menushow_www_wuming_ren" style="" align="center"> <a href="#" onClick="offmenu_wwwwumingren();on_www_wuming_ren()">
<img src="/img/20240418_www_wuming_ren_4.gif" width="161" height="24" border="0" /></a> <br />
<a href="https://www.wuming.ren">武鸣人一号</a><br />
<a href="https://www.wuming.ren">武鸣人二号</a><br />
<a href="https://www.wuming.ren">武鸣人三号</a><br />
<br />
<a href="https://www.wuming.ren">武鸣人四号</a><br />
<a href="https://www.wuming.ren">武鸣人五号</a><br />
<br />
<a href="https://www.wuming.ren">武鸣人六号</a><br />
<a href="https://www.wuming.ren">武鸣人七号</a><br />
<a href="https://www.wuming.ren">武鸣人八号</a><br />
</div>
<SCRIPT LANGUAGE="JavaScript">
// Set Show to "yes" to show the menu on start-up.
// Set Show to "no" to show the selector on start-up.
Show ="no";
// Set OffX in pixels to a negative number
// somewhat larger than the width of the menu.
var OffX = -200;
// Set the PosX and PosY variables
// to the location on the screen where the
// menu should position (in pixels) when stopped.
var PosX =  10;
var PosY =  10;
// Usually, use the settings shown; but you can
// change the speed and the increment of motion
// across the screen, below.
var speed        = 5;
var increment    = 5;
var incrementNS4 = 5; // for slower NS4 browsers
// do not edit below this line
var is_NS = navigator.appName=="Netscape";
var is_Ver = parseInt(navigator.appVersion);
var is_NS4 = is_NS&&is_Ver>=4&&is_Ver<5;
var is_NS5up = is_NS&&is_Ver>=5;
var MenuX = OffX;
var SelX = PosX;
var sPosX = PosX;
var sOffX = OffX;
if (Show == "yes") {
sPosX = OffX;
sOffX = PosX;
MenuX = sOffX;
SelX = sPosX;
}
if (is_NS4) {
increment = incrementNS4;
Lq = "document.layers.";
Sq = "";
eval(Lq+'menuselect_wwwwumingren'+Sq+'.left=sPosX');
eval(Lq+'menushow_www_wuming_ren'+Sq+'.left=sOffX');
eval(Lq+'menuselect_wwwwumingren'+Sq+'.top=PosY');
eval(Lq+'menushow_www_wuming_ren'+Sq+'.top=PosY');
} else {
Lq = "document.all.";
Sq = ".style";
document.getElementById('menuselect_wwwwumingren').style.left = sPosX+"px";
document.getElementById('menushow_www_wuming_ren').style.left = sOffX+"px";
document.getElementById('menuselect_wwwwumingren').style.top = PosY+"px";
document.getElementById('menushow_www_wuming_ren').style.top = PosY+"px";
}
function onmenu_wwwwumingren() {
if (MenuX < PosX) {
MenuX = MenuX + increment;
if (is_NS5up) {
document.getElementById('menushow_www_wuming_ren').style.left = MenuX+"px";
} else {
eval(Lq+'menushow_www_wuming_ren'+Sq+'.left=MenuX');
}
setTimeout('onmenu_wwwwumingren()',speed);
}
}//武鸣人网站https://www.wuming.ren 网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)
function offmenu_wwwwumingren() {
if (MenuX > OffX) {
MenuX = MenuX - increment;
if (is_NS5up) {
document.getElementById('menushow_www_wuming_ren').style.left = MenuX+"px";
} else {
eval(Lq+'menushow_www_wuming_ren'+Sq+'.left=MenuX');
}
setTimeout('offmenu_wwwwumingren()',speed);
}
}//武鸣人网站https://www.wuming.ren 网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)
function off_www_wuming_ren() {
if (SelX > OffX) {
SelX = SelX - increment;
if (is_NS5up) {
document.getElementById('menuselect_wwwwumingren').style.left = SelX+"px";
} else {
eval(Lq+'menuselect_wwwwumingren'+Sq+'.left=SelX');
}
setTimeout('off_www_wuming_ren()',speed);
}
}//武鸣人网站https://www.wuming.ren 网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)
function on_www_wuming_ren() {
if (SelX < PosX) {
SelX = SelX + increment;
if (is_NS5up) {
document.getElementById('menuselect_wwwwumingren').style.left = SelX+"px";
} else {
eval(Lq+'menuselect_wwwwumingren'+Sq+'.left=SelX');
}
setTimeout('on_www_wuming_ren()',speed);
}//武鸣人网站https://www.wuming.ren 网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)
}
</script>
<a href="https://www.wuming.ren">武鸣人</a>，各种信息资源免费发布，分享励志语录经典短句，减肥健身常识，各种js特效代码。网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)<hr>
<!--欢迎来到武鸣人信息资源平台，各种信息免费发布，资源共享合作共赢，分享互联网流行的励志语录经典短句，减肥健身健康小常识及打卡记录，收集各种js特效代码。-->
<script type="text/javascript" src="https://www.wuming.ren/ad/tc.js"></script>
<script type="text/javascript" src="https://www.wuming.ren/ad/a.js"></script>