js 下拉级联菜单

时间：2013-04-25 11:00 来源：网络整理作者：采集侠收藏

这是由dw自带的功能写的一款js 下拉级联菜单哦，如果喜欢的话就下载了，好了费话不说多了来看看吧。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
<html xmlns="">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarVertical.css" rel="stylesheet" type="text/css" />
<script language="javascript">

var Spry;
if(!Spry)
{
Spry = {};
}
if(!Spry.Widget)
{
Spry.Widget = {};
}

Spry.Widget.MenuBar = function(element, opts)
{
this.init(element, opts);
};

Spry.Widget.MenuBar.prototype.init = function(element, opts)
{
this.element = this.getElement(element);

// represents the current (sub)menu we are operating on
this.currMenu = null;

var isie = (typeof document.all != 'undefined' && typeof window.opera == 'undefined' && navigator.vendor != 'KDE');
if(typeof document.getElementById == 'undefined' || (navigator.vendor == 'Apple Computer, Inc.' && typeof window.XMLHttpRequest == 'undefined') || (isie && typeof document.uniqueID == 'undefined'))
{
// bail on older unsupported browsers
return;
}

// load hover images now
if(opts)
{
  for(var k in opts)
  {
   var rollover = new Image;
   rollover.src = opts[k];
  }
}

if(this.element)
{
  this.currMenu = this.element;
  var items = this.element.getElementsByTagName('li');
  for(var i=0; i<items.length; i++)
  {
   this.initialize(items[i], element, isie);
   if(isie)
   {
    this.addClassName(items[i], "MenuBarItemIE");
    items[i].style.position = "static";
   }
  }
  if(isie)
  {
   if(this.hasClassName(this.element, "MenuBarVertical"))
   {
    this.element.style.position = "relative";
   }
   var linkitems = this.element.getElementsByTagName('a');
   for(var i=0; i<linkitems.length; i++)
   {
    linkitems[i].style.position = "relative";
   }
  }
}
};

Spry.Widget.MenuBar.prototype.getElement = function(ele)
{
if (ele && typeof ele == "string")
return document.getElementById(ele);
return ele;
};

Spry.Widget.MenuBar.prototype.hasClassName = function(ele, className)
{
if (!ele || !className || !ele.className || ele.className.search(new RegExp("\b" + className + "\b")) == -1)
{
return false;
}
return true;
};

Spry.Widget.MenuBar.prototype.addClassName = function(ele, className)
{
if (!ele || !className || this.hasClassName(ele, className))
return;
ele.className += (ele.className " " : "") + className;
};

Spry.Widget.MenuBar.prototype.removeClassName = function(ele, className)
{
if (!ele || !className || !this.hasClassName(ele, className))
return;
ele.className = ele.className.replace(new RegExp("\s*\b" + className + "\b", "g"), "");
};

// addEventListener for Menu Bar
// attach an event to a tag without creating obtrusive HTML code
Spry.Widget.MenuBar.prototype.addEventListener = function(element, eventType, handler, capture)
{
try
{
  if (element.addEventListener)
  {
   element.addEventListener(eventType, handler, capture);
  }
  else if (element.attachEvent)
  {
   element.attachEvent('on' + eventType, handler);
  }
}
catch (e) {}
};

// createIframeLayer for Menu Bar
// creates an IFRAME underneath a menu so that it will show above form controls and ActiveX
Spry.Widget.MenuBar.prototype.createIframeLayer = function(menu)
{
var layer = document.createElement('iframe');
layer.tabIndex = '-1';
layer.src = 'javascript:false;';
menu.parentNode.appendChild(layer);

layer.style.left = menu.offsetLeft + 'px';
layer.style.top = menu.offsetTop + 'px';
layer.style.width = menu.offsetWidth + 'px';
layer.style.height = menu.offsetHeight + 'px';
};

开发教程

js 下拉级联菜单

js/jQuery教程阅读排行

最新文章

服务咨询

整站源码

网站模板

免费源码

关于我们

扫码关注有惊喜