我COPY了别人的源码,因为是菜鸟级别,经过修改后已接近需要。但仍有一点问题。
它是侧边导航菜单,我希望在进入页面的时候是展开的。不需要的时候,点击一下,就隐藏,需要的时候再展开。
但是运行后,在第一次点隐藏的时候,出了点问题。请高手帮忙修改一下,谢谢代码如下:
<%@LANGUAGE="JAVASCRIPT" CODEPAGE="936"%>
<html>
<head>
<title>q</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style type="text/css">
<!--a:link { color:#666666; text-decoration: none; font-size:13px;}
a:visited { color: #666666; text-decoration: none; font-size:13px;}
a:hover { color: #666666; text-decoration:none; font-size:13px;}
a:active { color: #666666; text-decoration: none; font-size:13px;}
img {border: solid 0px #FFFFFF;}
--><!--
#menuBar {position:relative;left: 0px;top:0px; width:220px;height:100%;}
#r1 {position: absolute;left:200px;top:0px; width: 15px; height:100%; background:#ffffff; border:solid 1px #CCCCCC}
#r2 { position:absolute;top:50%; left:30%;}
#e1 {height:100%; width:160px; background:#ffffff;}
#e2 {position:absolute;top: 40%; left:20px;}<!-- 控制隐藏栏CSS-->
-->
</style>
<script language="JavaScript">
<!--
var pee = -200
var drec = 40;
var speed = 20;
//Don't touch!
var l = pee;
//Don't touch. This is the function that closes the menu
function Proj7GlideBack () {l += drec;
if (document.layers) {
document.menuBar.left = l;
}
else if (document.all) {document.all.menuBar.style.pixelLeft = l;
}
else if (document.getElementById) {document.getElementById('menuBar').style.left = l + 'px';
}
if (l < 0)
setTimeout('Proj7GlideBack()', speed);
else {
if (document.layers) {
var html = '';
html += '<A HREF="javascript:;"';
html += 'onClick="Proj7GlideOut(); return false;"';
html += 'Class="glideText"';
html += '<img src="indeximage/c2.jpg">'+ '<br>';
html += '<img src="indeximage/c2.jpg">'+ '<Br>';
html += '<\/A>';
var a = window.document.menuBar.document.glider;
a.document.open();
a.document.write(html);
a.document.close();
}
else if (document.all) {document.all.glidetextLink.innerHTML = '<img src="indeximage/c2.jpg">';
document.all.glidetextLink.onclick = moveIn;
}
}
}
//Don't touch. This is the function that opens the menu
function Proj7GlideOut () {l -= drec;
if (document.layers) {document.menuBar.left = l;
}
else if (document.all) {document.all.menuBar.style.pixelLeft = l;
}
else if (document.getElementById) {document.getElementById('menuBar').style.left = l + 'px';
}
if (l > pee)
setTimeout('Proj7GlideOut()', speed);
else {
if (document.layers) {
var html = '';
html += '<A HREF="javascript:;"';
html += 'onclick="Proj7GlideBack(); return false;"';
html += 'Class="glideText"';
html += '<img src="indeximage/c2.jpg">'+ '<Br>';
html += '<img src="indeximage/c2.jpg">'+ '<Br>';
html += '<\/A>';
var a = window.document.menuBar.document.glider;
a.document.open();
a.document.write(html);
a.document.close();
}
else if (document.all) {document.all.glidetextLink.innerHTML = '<img src="indeximage/c1.jpg">';
document.all.glidetextLink.onclick = moveOut;
}
else if (document.getElementById) {
document.getElementById('glidetextLink').firstChild.nodeValue ='<img src="indeximage/c1.jpg">';
document.getElementById('glidetextLink').onclick = moveOut;
}
}
}
function moveIn () {Proj7GlideOut();return false;
}
function moveOut() {Proj7GlideBack();return false;
}
<!--NNresizeFix Reloads the page to workaround a Netscape Bug--></script>
</head>
<body bgcolor="#FFFFFF" leftmargin="0px" topmargin="0px">
<div id="menuBar" style="">
<div id="e1">
<div id="e2" >
<a href="#" >第一行</a><br>
<a href="#">第一行 </a><br>
<a href="#">第二行</a><br>
<a href="#">第三行</a><br>
<a href="#">第四行</a><br>
<a href="#">第五行</a>
</div>
</div>
<div id="r1">
<div id="r2"> <a id="glidetextLink"
href="javascript:; "class="glideText" onClick="Proj7GlideBack(); return false" onFocus="if(this.blur)this.blur()"> <img src="indeximage/c1.jpg"> </a> </div>
</div>
</div>
</body>
</html>
它是侧边导航菜单,我希望在进入页面的时候是展开的。不需要的时候,点击一下,就隐藏,需要的时候再展开。
但是运行后,在第一次点隐藏的时候,出了点问题。请高手帮忙修改一下,谢谢代码如下:
<%@LANGUAGE="JAVASCRIPT" CODEPAGE="936"%>
<html>
<head>
<title>q</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style type="text/css">
<!--a:link { color:#666666; text-decoration: none; font-size:13px;}
a:visited { color: #666666; text-decoration: none; font-size:13px;}
a:hover { color: #666666; text-decoration:none; font-size:13px;}
a:active { color: #666666; text-decoration: none; font-size:13px;}
img {border: solid 0px #FFFFFF;}
--><!--
#menuBar {position:relative;left: 0px;top:0px; width:220px;height:100%;}
#r1 {position: absolute;left:200px;top:0px; width: 15px; height:100%; background:#ffffff; border:solid 1px #CCCCCC}
#r2 { position:absolute;top:50%; left:30%;}
#e1 {height:100%; width:160px; background:#ffffff;}
#e2 {position:absolute;top: 40%; left:20px;}<!-- 控制隐藏栏CSS-->
-->
</style>
<script language="JavaScript">
<!--
var pee = -200
var drec = 40;
var speed = 20;
//Don't touch!
var l = pee;
//Don't touch. This is the function that closes the menu
function Proj7GlideBack () {l += drec;
if (document.layers) {
document.menuBar.left = l;
}
else if (document.all) {document.all.menuBar.style.pixelLeft = l;
}
else if (document.getElementById) {document.getElementById('menuBar').style.left = l + 'px';
}
if (l < 0)
setTimeout('Proj7GlideBack()', speed);
else {
if (document.layers) {
var html = '';
html += '<A HREF="javascript:;"';
html += 'onClick="Proj7GlideOut(); return false;"';
html += 'Class="glideText"';
html += '<img src="indeximage/c2.jpg">'+ '<br>';
html += '<img src="indeximage/c2.jpg">'+ '<Br>';
html += '<\/A>';
var a = window.document.menuBar.document.glider;
a.document.open();
a.document.write(html);
a.document.close();
}
else if (document.all) {document.all.glidetextLink.innerHTML = '<img src="indeximage/c2.jpg">';
document.all.glidetextLink.onclick = moveIn;
}
}
}
//Don't touch. This is the function that opens the menu
function Proj7GlideOut () {l -= drec;
if (document.layers) {document.menuBar.left = l;
}
else if (document.all) {document.all.menuBar.style.pixelLeft = l;
}
else if (document.getElementById) {document.getElementById('menuBar').style.left = l + 'px';
}
if (l > pee)
setTimeout('Proj7GlideOut()', speed);
else {
if (document.layers) {
var html = '';
html += '<A HREF="javascript:;"';
html += 'onclick="Proj7GlideBack(); return false;"';
html += 'Class="glideText"';
html += '<img src="indeximage/c2.jpg">'+ '<Br>';
html += '<img src="indeximage/c2.jpg">'+ '<Br>';
html += '<\/A>';
var a = window.document.menuBar.document.glider;
a.document.open();
a.document.write(html);
a.document.close();
}
else if (document.all) {document.all.glidetextLink.innerHTML = '<img src="indeximage/c1.jpg">';
document.all.glidetextLink.onclick = moveOut;
}
else if (document.getElementById) {
document.getElementById('glidetextLink').firstChild.nodeValue ='<img src="indeximage/c1.jpg">';
document.getElementById('glidetextLink').onclick = moveOut;
}
}
}
function moveIn () {Proj7GlideOut();return false;
}
function moveOut() {Proj7GlideBack();return false;
}
<!--NNresizeFix Reloads the page to workaround a Netscape Bug--></script>
</head>
<body bgcolor="#FFFFFF" leftmargin="0px" topmargin="0px">
<div id="menuBar" style="">
<div id="e1">
<div id="e2" >
<a href="#" >第一行</a><br>
<a href="#">第一行 </a><br>
<a href="#">第二行</a><br>
<a href="#">第三行</a><br>
<a href="#">第四行</a><br>
<a href="#">第五行</a>
</div>
</div>
<div id="r1">
<div id="r2"> <a id="glidetextLink"
href="javascript:; "class="glideText" onClick="Proj7GlideBack(); return false" onFocus="if(this.blur)this.blur()"> <img src="indeximage/c1.jpg"> </a> </div>
</div>
</div>
</body>
</html>
解决方案 »
免费领取超大流量手机卡,每月29元包185G流量+100分钟通话, 中国电信官方发货