一个支持二级子菜单的 Javascript 动态下拉菜单[JS][7Z]

整理了一个支持二级子菜单的 Javascript 动态下拉菜单。测试兼容性不错,至少支持 IE 8 和 Google Chrome 浏览器 10。

预览一下主要代码,网上出镜率挺高的
引用内容 引用内容
mtDropDown.spacerGif = "js/list.gif";
mtDropDown.dingbatOn = "js/more_list.gif";
mtDropDown.dingbatOff = "js/more.gif";
mtDropDown.dingbatSize = 14;
mtDropDown.menuPadding = 5;    //下拉菜单中的padding
mtDropDown.itemPadding = 4;    //下拉菜单之间的行间距
mtDropDown.shadowSize = 2;    //应该是下拉菜单下面和右面的定位
mtDropDown.shadowOffset = 3;
mtDropDown.shadowColor = "#E3E3E3";    //下拉菜单底框的颜色
mtDropDown.shadowPng = "";
mtDropDown.backgroundColor = "#F3F3F3"; //下拉菜单的背景颜色
mtDropDown.backgroundPng = "";
mtDropDown.hideDelay = 200;
mtDropDown.slideTime = 300;    //下拉菜单出现和消失时的快慢程度
mtDropDown.reference = {topLeft:1,topRight:2,bottomLeft:3,bottomRight:4};
mtDropDown.direction = {down:1,right:2};
mtDropDown.registry = [];
mtDropDown._maxZ = 100;
mtDropDown.isSupported = function() {
if (typeof mtDropDown.isSupported.r == "boolean")
return mtDropDown.isSupported.r;
var ua = navigator.userAgent.toLowerCase();
var an = navigator.appName;
var r = false;
if (ua.indexOf("gecko") > -1) r = true;
else if (an == "Microsoft Internet Explorer") {
if (document.getElementById) r = true;
}
mtDropDown.isSupported.r = r;
return r;
}
mtDropDown.initialize = function() {
for (var i = 0, menu = null; menu = this.registry[i]; i++) {
menu.initialize();
}
}
mtDropDown.renderAll = function() {
var aMenuHtml = [];
for (var i = 0, menu = null; menu = this.registry[i]; i++) {
aMenuHtml[i] = menu.toString();
}
document.write(aMenuHtml.join(""));
}
function mtDropDown(oActuator, iDirection, iLeft, iTop, iReferencePoint, parentMenuSet) {
this.addItem = addItem;
this.addMenu = addMenu;
this.toString = toString;
this.initialize = initialize;
this.isOpen = false;
this.show = show;
this.hide = hide;
this.items = [];
this.onactivate = new Function();
this.ondeactivate = new Function();
this.onmouseover = new Function();
this.onqueue = new Function();
this.index = mtDropDown.registry.length;
mtDropDown.registry[this.index] = this;
var id = "mtDropDown" + this.index;
var contentHeight = null;
var contentWidth = null;
var childMenuSet = null;
var animating = false;
var childMenus = [];
var slideAccel = -1;
var elmCache = null;
var ready = false;
var _this = this;
var a = null;
var pos = iDirection == mtDropDown.direction.down ? "top" : "left";
var dim = null;
[以下略]

完整压缩包下载:
[本日志由 parno 于 2011-09-05 12:06 AM 编辑]
上一篇: Javascript 图片渐变轮换效果
下一篇: ASP 在线动态创建数据库的相关 SQL 命令
文章来自: 网络
引用通告: 查看所有引用 | 我要引用此文章
Tags: javascript 菜单 CSS HTML
相关日志:
评论: 0 | 引用: 0 | 查看次数: 8099
发表评论
昵 称:
密 码: 游客发言不需要密码.
邮 箱: 邮件地址支持Gravatar头像,邮箱地址不会公开.
网 址: 输入网址便于回访.
内 容:
验证码:
选 项:
虽然发表评论不用注册,但是为了保护您的发言权,建议您注册帐号.
字数限制 500 字 | UBB代码 关闭 | [img]标签 关闭