CSS+JavaScript 实现菜单功能
2010-09-14 13:37:18 来源:WEB开发网通过简单的Javascript代码就可以增加菜单。同时使得HTML页面非常简洁,只需要写2行代码即可!O(∩_∩)O
1.使用前提,在HTML页面中引入一个CSS文件,和一个JavaScript文件。如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>Menu</TITLE>
<link type="text/css" rel="stylesheet" href="menu.css">
</HEAD>
<BODY>
<div><script src="menu.js"></script></div>
</BODY>
</HTML>
引入CSS文件:<link type="text/css" rel="stylesheet" href="menu.css"> ,menu.css代码见后
引入JavaScript文件:<script src="menu.js"></script>
2.定义菜单代码如下:
if (document.getElementById){
var root = new Root();
var m1 = new Menu("File","alert(this.innerText);");
root.add(m1);
var m11 = new MenuItem("New");
m1.add(m11);
m1.add(new MenuItem("Open","alert('open file');"));
var m12 = new MenuItem("Save");
m1.add(m12);
m1.add(new MenuItem("Save As"));
m1.add(new MenuItem("Close"));
m1.add(new MenuItem(""));
var m2 = new Menu("Edit");
root.add(m2);
root.toString();
}
Tags:CSS JavaScript 实现
编辑录入:爽爽 [复制链接] [打 印]更多精彩
赞助商链接