xp风格菜单[1]

[入库:2005年8月18日] [更新:2007年3月25日]

本文简介:选择自 avlee 的 blog

网易的个人主页收费了,顺便把以前写的一些东西贴出来,或许可以用用。

xp风格菜单

context.js

<!--
/**
 *@context menu with xp style
 *@author: lixingang  avlee@163.com 2002.3.25
 *@version v1.0
 */

// menu object
function contextmenu()
{
 this.items   = new array();
 
 this.additem = function (item)
 {
  this.items[this.items.length] = item;
 }

 this.show = function (odoc)
 {
  var strshow = "";
  var i;
  
  strshow = "<div id=\"rightmenu\" style=\"background-color: #ffffff; border: #000000 1px solid; left: 0px; position: absolute; top: 0px; visibility: hidden; z-index: 10\">";
  strshow += "<table border=\"0\" height=\"";
  strshow += this.items.length * 20;
  strshow += "\" cellpadding=\"0\" cellspacing=\"0\">";
  strshow += "<tr height=\"3\"><td bgcolor=\"#d0d0ce\" width=\"2\"></td><td>";
  strshow += "<table border=\"0\" width=\"100%\" height=\"100%\" cellpadding=0 cellspacing=0 bgcolor=\"#ffffff\">";
  strshow += "<tr><td bgcolor=\"#d0d0ce\" width=\"23\"></td><td><img src=\" \" height=\"1\" border=\"0\"></td></tr></table>";
  strshow += "</td><td width=\"2\"></td></tr>";
  strshow += "<tr><td bgcolor=\"#d0d0ce\"></td><td>";
  strshow += "<table border=\"0\" width=\"100%\" height=\"100%\" cellpadding=3 cellspacing=0 bgcolor=\"#ffffff\">";
  odoc.write(strshow);
  for(i=0; i<this.items.length; i++)
  {
   this.items[i].show(odoc);
  }
  strshow = "</table></td><td></td></tr>";
  strshow += "<tr height=\"3\"><td bgcolor=\"#d0d0ce\"></td><td>";
  strshow += "<table border=\"0\" width=\"100%\" height=\"100%\" cellpadding=0 cellspacing=0 bgcolor=\"#ffffff\">";
  strshow += "<tr><td bgcolor=\"#d0d0ce\" width=\"23\"></td><td><img src=\" \" height=\"1\" border=\"0\"></td></tr></table>";
  strshow += "</td><td></td></tr>";
  strshow += "</table></div>\n";
  odoc.write(strshow);
 }
}

// menu item object
function contextitem(text, icon, cmd, type)
{
 this.text = text ? text : "";
 this.icon = icon ? icon : "";
 this.cmd = cmd ? cmd : "";
 this.type = type ? type : "menu";
 
 this.show = function (odoc)
 {
  var strshow = "";
  
  if(this.type == "menu")
  {
   strshow += "<tr ";
   strshow += "onmouseover=\"changestyle(this, 'on');\" ";
   strshow += "onmouseout=\"changestyle(this, 'out');\" ";
   strshow += "onclick=\"";
   strshow += this.cmd;
   strshow += "\">";
   strshow += "<td class=\"ltdexit\" width=\"16\">";
   if (this.icon == "")
    strshow += "&nbsp;";
   else {
    strshow += "<img border=\"0\" src=\"";
    strshow += this.icon;
    strshow += "\" width=\"16\" height=\"16\" style=\"position: relative\"></img>";
   }
   strshow += "</td><td class=\"mtdexit\">";
   strshow += this.text;
   strshow += "</td><td class=\"rtdexit\" width=\"5\">&nbsp;</td></tr>";
  }
  else if (this.type == "separator")
  {
   strshow += "<tr><td class=\"ltdexit\">&nbsp;</td>";
   strshow += "<td class=\"mtdexit\" colspan=\"2\"><hr color=\"#000000\" size=\"1\"></td></tr>";
  }
  
  odoc.write(strshow);
 }
}

function changestyle(obj, cmd)

 if(obj) try {
  var imgobj = obj.children(0).children(0);
  
  if(cmd == 'on') {
   obj.children(0).classname = "ltdfocus";
   obj.children(1).classname = "mtdfocus";
   obj.children(2).classname = "rtdfocus";
   if(imgobj)
   {
    if(imgobj.tagname.touppercase() == "img")
    {

本文关键:Javascript
  相关方案
Google
 

本站最佳浏览方式为 分辨率 1024x768 IE 6.0(或更高版本的 IE浏览器)

go top