类似QQ的菜单,刷新时记住当前打开状态
<head>
<style type="text/css">
BODY {
FONT-SIZE: 12px; SCROLLBAR-HIGHLIGHT-COLOR: buttonface; SCROLLBAR-SHADOW-COLOR: buttonface; COLOR: #333333; SCROLLBAR-3DLIGHT-COLOR: buttonhighlight; SCROLLBAR-TRACK-COLOR: #eeeeee; FONT-FAMILY: "song", "MS Shell Dlg"; TEXT-ALIGN: center; SCROLLBAR-DARKSHADOW-COLOR: buttonshadow; BACKGROUND-COLOR: #ffffff
;}
Select {
BACKGROUND-COLOR: #f5f5f5; COLOR: #666666; FILTER: Alpha(Opacity=50); FONT-FAMILY: "song", "MS Shell Dlg", "宋体"; FONT-SIZE: 12px
}
INPUT { font-family: Tahoma, Verdana; font-size: 12px; font-weight: normal; background-color: #eeeeee; color: #111111 }
.textarea1 { font-family: Tahoma, Verdana; font-size: 12px; font-weight: normal; background-color: #eeeeee; color: #111111 }
TD {
FONT-SIZE: 12px; COLOR: #333333; font-family: Tahoma, Verdana;
}
A:link {
FONT-SIZE: 12px; COLOR: #333333; TEXT-DECORATION: none
}
A:visited {
FONT-SIZE: 12px; COLOR: #333333; TEXT-DECORATION: none
}
A:hover {
FONT-SIZE: 12px; COLOR: #000066; TEXT-DECORATION: underline
}
A.w:link {
FONT-SIZE: 12px; COLOR: #ffffff; TEXT-DECORATION: none
}
A.w:visited {
FONT-SIZE: 12px; COLOR: #ffffff; TEXT-DECORATION: none
}
A.w:hover {
FONT-SIZE: 12px; COLOR: #ffffff; TEXT-DECORATION: underline
}
.button1 {
BORDER-RIGHT: #665b8e 1px solid; PADDING-RIGHT: 1px; BORDER-TOP: #ffffff 1px solid; PADDING-LEFT: 1px; FONT-SIZE: 12px; BACKGROUND: buttonface; PADDING-BOTTOM: 1px; BORDER-LEFT: #ffffff 1px solid; CURSOR: hand; COLOR: #333333; PADDING-TOP: 1px; BORDER-BOTTOM: #665b8e 1px solid; FONT-FAMILY: "MS Shell Dlg", "Tahoma", "宋体"; HEIGHT: 20px
}
.menutitle{
cursor:pointer;
margin-bottom: 5px;
background-color:#ECECFF;
color:#000000;
width:140px;
padding:2px;
text-align:center;
font-weight:bold;
/*/*/border:1px solid #000000;/* */
}
.submenu{
margin-bottom: 0.5em;
}
</style>
<script type="text/javascript">
if (document.getElementById){
document.write('<style type="text/css">\n')
document.write('.submenu{display: none;}\n')
document.write('</style>\n')
}
function SwitchMenu(obj){
if(document.getElementById){
var el = document.getElementById(obj);
var ar = document.getElementById("masterdiv").getElementsByTagName("span");
if(el.style.display != "block"){
for (var i=0; i<ar.length; i++){
if (ar[i].className=="submenu")
ar[i].style.display = "none";
}
el.style.display = "block";
}else{
el.style.display = "none";
}
}
}
function readCookie(name)
{
var cookieValue = "";
var search = name + "=";
if(document.cookie.length > 0)
{
offset = document.cookie.indexOf(search);
if (offset != -1)
{
offset += search.length;
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
cookieValue = unescape(document.cookie.substring(offset, end))
}
}
return cookieValue;
}
function writeCookie(name, value, hours)
{
var expire = "";
if(hours != null)
{
expire = new Date((new Date()).getTime() + hours * 3600000);
expire = "; expires=" + expire.toGMTString();
}
document.cookie = name + "=" + escape(value) + expire;
}
function loadQQpos(){
var pos=readCookie("QQpos");
if(!pos)
return;
setQQmenu(pos,"masterdiv");
}
function storeQQpos(){
writeCookie("QQpos",lookQQmenu("masterdiv"),24);
}
function setQQmenu(pos,menuID){
if(pos==-1)
return;
var theMenu=document.getElementById(menuID);
var items=theMenu.getElementsByTagName("span");
if(items[pos])
items[pos].style.display="block";
}
function lookQQmenu(menuID){
var theMenu=document.getElementById(menuID);
var items=theMenu.getElementsByTagName("span");
for(var i=0;i<items.length;i++)
if(items[i].style.display=="block")
return i;
return -1;
}
</script>
</head>
<body onload="loadQQpos()" onunload="storeQQpos()">
<div id="masterdiv">
<div class="menutitle" onclick="SwitchMenu('sub1')">网页特效</div>
<span class="submenu" id="sub1"> - <a href="#">图形图象</a><br>
- <a href="#">鼠标事件</a><br>
- <a href="#">时间日期</a> <br>
- <a href="#">导航菜单</a></span>
<div class="menutitle" onclick="SwitchMenu('sub2')">插件中心</div>
<span class="submenu" id="sub2"> - <a href="#">DW插件</a><br>
- <a href="#">FW插件</a><br>
- <a href="#">ps滤镜</a> </span>
<div class="menutitle" onclick="SwitchMenu('sub3')">网络学院</div>
<span class="submenu" id="sub3"> - <a href="#">网页制作</a><br>
</span>
<div class="menutitle" onclick="SwitchMenu('sub4')">网站联盟</div>
<span class="submenu" id="sub4"> - <a href="#">网页设计</a><br>
- <a href="#">艺术制作</a><br>
- <a href="#">酷站推荐</a><br>
</span></div>
</body>
</html>











文章评论
共有 0 位网友发表了评论 此处只显示部分留言 点击查看完整评论页面