不使用图片仿Windows右键菜单
没有使用不使用图片仿Windows右键菜单,这里灵活使用了文鼎字,配合CSS和JS做出了这个和系统右键菜单很相似的东东。
没有使用不使用图片仿Windows右键菜单,这里灵活使用了文鼎字,配合CSS和JS做出了这个和系统右键菜单很相似的东东。
答案:<HTML>
<HEAD>
<TITLE>极酷的多级右键菜单</TITLE>
<META content="text/html; charset=gb2312" http-equiv=Content-Type>
<STYLE type=text/css>BODY {
FONT-SIZE: 12px;
}
.info{FONT-SIZE: 14px;color:#FFFFFF;font-family:@Tahoma,@宋体;width:20px}
TABLE {
CURSOR: default; FONT-SIZE: 12px; MARGIN: 0px
}
TR {
HEIGHT: 20px
}
TR.over {
BACKGROUND-COLOR: #000080; COLOR: #ffffff; CURSOR: default; FONT-SIZE: 12px
}
TR.out {
BACKGROUND-COLOR: #efefef; COLOR: #000000; FONT-SIZE: 12px
}
DIV.rm_div {
BACKGROUND-COLOR: #efefef; BORDER-BOTTOM: #ffffff 1px outset; BORDER-LEFT: #ffffff 1px outset; BORDER-RIGHT: #ffffff 1px outset; BORDER-TOP: #ffffff 1px outset; DISPLAY: none; FILTER: Alpha(Opacity='95'); HEIGHT: 0px; PADDING-BOTTOM: 1px; PADDING-LEFT: 1px; PADDING-RIGHT: 1px; PADDING-TOP: 1px; POSITION: absolute; WIDTH: 0px
}
HR.sperator {
BORDER-BOTTOM: #ffffff 1px inset; BORDER-LEFT: #ffffff 1px inset; BORDER-RIGHT: #ffffff 1px inset; BORDER-TOP: #ffffff 1px inset; WIDTH: 95%
}
.w2kfont {
FONT-FAMILY: Tahoma; FONT-SIZE: 8pt
}
</STYLE>
<SCRIPT language=JScript>
<!--
function RightMenu()
{
this.AddExtendMenu=AddExtendMenu;
this.AddItem=AddItem;
this.GetMenu=GetMenu;
this.HideAll=HideAll;
this.I_OnMouseOver=I_OnMouseOver;
this.I_OnMouseOut=I_OnMouseOut;
this.I_OnMouseUp=I_OnMouseUp;
this.P_OnMouseOver=P_OnMouseOver;
this.P_OnMouseOut=P_OnMouseOut;
A_rbpm = new Array();
HTMLstr = "";
HTMLstr += "<!-- RightButton PopMenu -->\n";
HTMLstr += "\n";
HTMLstr += "<!-- PopMenu Starts -->\n";
HTMLstr += "<div id='E_rbpm' class='rm_div'>\n";
HTMLstr += "<table width='100%' border='0' cellspacing='0'>\n";
HTMLstr += "<tr><td height='264' width='20' valign='bottom' bgcolor='#000000' onclick=window.event.cancelBubble=true; class=info>娃海作制";
HTMLstr += "</td><td height='264' width='120' style='padding: 1' valign='bottom'>\n";
HTMLstr += "<table width='100%' border='0' cellspacing='0'>\n";
HTMLstr += "<!-- Insert A Extend Menu or Item On Here For E_rbpm -->\n";
HTMLstr += "</table></td></tr></table>\n";
HTMLstr += "</div>\n";
HTMLstr += "<!-- Insert A Extend_Menu Area on Here For E_rbpm -->";
HTMLstr += "\n";
HTMLstr += "<!-- PopMenu Ends -->\n";
}
function AddExtendMenu(id,img,wh,name,parent)
{
var TempStr = "";
eval("A_"+parent+".length++");
eval("A_"+parent+"[A_"+parent+".length-1] = id");
TempStr += "<div id='E_"+id+"' class='rm_div'>\n";
TempStr += "<table width='100%' border='0' cellspacing='0'>\n";
TempStr += "<!-- Insert A Extend Menu or Item On Here For E_"+id+" -->";
TempStr += "</table>\n";
TempStr += "</div>\n";
TempStr += "<!-- Insert A Extend_Menu Area on Here For E_"+id+" -->";
TempStr += "<!-- Insert A Extend_Menu Area on Here For E_"+parent+" -->";
HTMLstr = HTMLstr.replace("<!-- Insert A Extend_Menu Area on Here For E_"+parent+" -->",TempStr);
eval("A_"+id+" = new Array()");
TempStr = "";
TempStr += "<!-- Extend Item : P_"+id+" -->\n";
TempStr += "<tr id='P_"+id+"' class='out'";
TempStr += " onmouseover='P_OnMouseOver(\""+id+"\",\""+parent+"\")'";
TempStr += " onmouseout='P_OnMouseOut(\""+id+"\",\""+parent+"\")'";
TempStr += " onmouseup=window.event.cancelBubble=true;";
TempStr += " onclick=window.event.cancelBubble=true;";
TempStr += "><td nowrap>";
TempStr += "<font face='Wingdings' style='font-size:18px'>0</font> "+name+" </td><td style='font-family: webdings; text-align: ;'>4";
TempStr += "</td></tr>\n";
TempStr += "<!-- Insert A Extend Menu or Item On Here For E_"+parent+" -->";
HTMLstr = HTMLstr.replace("<!-- Insert A Extend Menu or Item On Here For E_"+parent+" -->",TempStr);
}
function AddItem(id,img,wh,name,parent,location)
{
var TempStr = "";
var ItemStr = "<!-- ITEM : I_"+id+" -->";
if(id == "sperator")
{
TempStr += ItemStr+"\n";
TempStr += "<tr class='out' onclick='window.event.cancelBubble=true;' onmouseup='window.event.cancelBubble=true;'><td colspan='2' height='1'><hr class='sperator'></td></tr>";
TempStr += "<!-- Insert A Extend Menu or Item On Here For E_"+parent+" -->";
HTMLstr = HTMLstr.replace("<!-- Insert A Extend Menu or Item On Here For E_"+parent+" -->",TempStr);
return;
}
if(HTMLstr.indexOf(ItemStr) != -1)
{
alert("I_"+id+"already exist!");
return;
}
TempStr += ItemStr+"\n";
TempStr += "<tr id='I_"+id+"' class='out'";
TempStr += " onmouseover='I_OnMouseOver(\""+id+"\",\""+parent+"\")'";
TempStr += " onmouseout='I_OnMouseOut(\""+id+"\")'";
TempStr += " onclick='window.event.cancelBubble=true;'";
if(location == null)
TempStr += " onmouseup='I_OnMouseUp(\""+id+"\",\""+parent+"\",null)'";
else
TempStr += " onmouseup='I_OnMouseUp(\""+id+"\",\""+parent+"\",\""+location+"\")'";
TempStr += "><td nowrap>";
TempStr +="<font face='Wingdings' style='font-size:18px'>"+wh+"</font> "+ name+" ";//
TempStr += "</td><td></td></tr>\n";
TempStr += "<!-- Insert A Extend Menu or Item On Here For E_"+parent+" -->";
HTMLstr = HTMLstr.replace("<!-- Insert A Extend Menu or Item On Here For E_"+parent+" -->",TempStr);
}
function GetMenu()
{
return HTMLstr;
}
function I_OnMouseOver(id,parent)
{
var Item;
if(parent != "rbpm")
{
var ParentItem;
ParentItem = eval("P_"+parent);
ParentItem.className="over";
}
Item = eval("I_"+id);
Item.className="over";
HideAll(parent,1);
}
function I_OnMouseOut(id)
{
var Item;
Item = eval("I_"+id);
Item.className="out";
}
function I_OnMouseUp(id,parent,location)
{
var ParentMenu;
window.event.cancelBubble=true;
OnClick();
ParentMenu = eval("E_"+parent);
ParentMenu.display="none";
if(location == null)
eval("Do_"+id+"()");
else
window.open(location);
}
function P_OnMouseOver(id,parent)
{
var Item;
var Extend;
var Parent;
if(parent != "rbpm")
{
var ParentItem;
ParentItem = eval("P_"+parent);
ParentItem.className="over";
}
HideAll(parent,1);
Item = eval("P_"+id);
Extend = eval("E_"+id);
Parent = eval("E_"+parent);
Item.className="over";
Extend.style.display="block";
Extend.style.posLeft=doc
上一个:选项卡,仿msn风格
下一个:清新的横排下拉菜单