首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

小弟我的新菜单

2012-10-26 
我的新菜单function Menu() {??? this.tbarH 34??? this.bbarH 28??? this.barH 27??? this.emen

我的新菜单


function Menu() {
??? this.tbarH = 34;
??? this.bbarH = 28;
??? this.barH = 27;
??? this.emendation = document.all ? 5 : 11;
??? this.tbarCss = "border:1px solid #99BBE8;background:url(images/tbar-bg.gif) repeat-x;font-weight: bold;color:#15428B;line-height:34;height:" + this.tbarH + "px";
??? this.bbarCss = "border:1px solid #99BBE8;background:url(images/tbar-bg.gif) repeat-x;font-weight: bold;color:#15428B;line-height:2;height:" + this.bbarH + "px";
??? this.itemheadCss = "border-style:solid;border-color:#99BBE8;border-width:0 1px 1px 1px;background:url(images/header-bg.gif) repeat-x;line-height:25px;text-align:center;cursor:pointer;font-weight: bold;color:#15428B;height:" + this.barH + "px";
??? this.itembodyCss = "border-style:solid;border-color:#99BBE8;border-width:0 1px 1px 1px;text-align:center;color:#15428B;display:none;";
??? this.itemCss = "border-style:solid;border-color:#999;border-width:0;text-align:center;padding-top:67px;cursor:pointer;background:url(images/item64.gif) no-repeat top";
??? this.container;
??? if (!arguments[0]) {
??????? alert("\u8bf7\u5728\u521b\u5efa\u83dc\u5355\u65f6\u6307\u5b9a\u83dc\u5355\u7684\u5bb9\u5668");
??????? return;
??? }
??? if (typeof (arguments[0]) == "string") {
??????? this.container = document.getElementById(arguments[0]);
??? } else {
??????? this.container = arguments[0];
??? }
??? var tbar = document.createElement("div");
??? tbar.style.cssText = this.tbarCss;
??? tbar.innerHTML = "<img src='images/menuicon.gif' align='middle'><span style='font-weight:bold;font-size:16px;'>\u7cfb\u7edf\u83dc\u5355</span>";
??? var bbar = document.createElement("div");
??? bbar.style.cssText = this.bbarCss;
??? var c = document.createElement("div");
??? c.style.border = "1px solid #99BBE8";
??? c.appendChild(tbar);
??? var body = document.createElement("div");
??? body.style.borderTop = "0px solid #99BBE8";
??? body.style.borderBottom = "0px solid #99BBE8";
??? //body.style.backgroundColor = "lightyellow";
??? body.style.height = parseInt(this.container.offsetHeight) - this.tbarH - this.bbarH - this.emendation + "px";
??? c.appendChild(body);
??? c.appendChild(bbar);
??? this.container.appendChild(c);
??? this.body = body;
??? this.ibids = [];
}
Menu.prototype.add = function (id, pid, name, href, icon) {
??? if (this.container) {
??????? if (pid == 0) {
??????????? var item = document.createElement("div");
??????????? item.setAttribute("id", "item" + id);
??????????? var itemhead = document.createElement("div");
??????????? itemhead.setAttribute("id", "itemhead" + id);
??????????? itemhead.style.cssText = this.itemheadCss;
??????????? itemhead.innerHTML = '<img src=images/menu3.gif align=bottom>' + name;
??????????? var ibids = this.ibids;
??????????? var bd = this.body;
??????????? var bh = this.barH;
??????????? itemhead.onclick = function (e) {
??????????????? var temp = this.id.substring(8);
??????????????? for (var k = 0; k < ibids.length; k++) {
??????????????????? if (ibids[k] == temp) {
??????????????????????? var ib = document.getElementById("itembody" + ibids[k]);
??????????????????????? ib.style.display = "block";
??????????????????????? ib.style.height = parseInt(bd.style.height) - ibids.length * (bh) + "px";
??????????????????? } else {
??????????????????????? document.getElementById("itembody" + ibids[k]).style.display = "none";
??????????????????? }
??????????????? }
??????????? };
??????????? item.appendChild(itemhead);
??????????? var itembody = document.createElement("div");
??????????? itembody.setAttribute("id", "itembody" + id);
??????????? itembody.style.cssText = this.itembodyCss;
??????????? item.appendChild(itembody);
??????????? this.ibids.push(id);
??????????? this.body.appendChild(item);
??????? } else {
??????????? var item = document.createElement("div");
??????????? item.setAttribute("id", "item" + id);
??????????? item.style.cssText = this.itemCss;
??????????? item.innerHTML = name;
??????????? var menu = this;
??????????? var obj = {id:id, pid:pid, name:name, href:href, icon:icon};
??????????? item.onclick = function (e) {
??????????????? if (menu.click) {
??????????????????? menu.click(obj);
??????????????? }
??????????? };
??????????? item.onmouseover = function (e) {
?????????????? // this.style.border = '1px solid #eee';
??????????? };
??????????? var ib = document.getElementById("itembody" + pid);
??????????? ib.appendChild(item);
??????? }
??? }
};
Menu.prototype.init = function (fn) {
??? var index = 0;
??? var firstib = document.getElementById("itembody" + this.ibids[index]);
??? firstib.style.display = "block";
??? firstib.style.height = parseInt(this.body.style.height) - this.ibids.length * (this.barH) + "px";
??? this.callback = fn;
};
Menu.prototype.load = function (url, params) {
??? var menu = this;
??? function kk(res) {
??????? var ret = eval("(" + res.responseText + ")");
??????? var data = ret.root;
??????? for (var k in data) {
??????????? menu.add(data[k].code, data[k].parent, data[k].name, data[k].url, data[k].icon);
??????? }
??????? var index = 0;
??????? var firstib = document.getElementById("itembody" + menu.ibids[index]);
??????? firstib.style.display = "block";
??????? firstib.style.height = parseInt(menu.body.style.height) - menu.ibids.length * (menu.barH) + "px";
??? }
??? Ajax(url, params, kk);
};
Menu.prototype.on = function (eName, fn) {
??? if(eName=='click'){
??? ?this.click = fn;
??? }
};
var Ajax = function (url, params, callback) {
??? var reqError = "\u54cd\u5e94\u5f02\u5e38\uff01\uff01\uff01";
??? var sendData = null;
??? var createXHR = function () {
??????? var XHR;
??????? if (window.XMLHttpRequest) {
??????????? XHR = new XMLHttpRequest();
??????? } else {
??????????? if (window.ActiveXObject) {
??????????????? try {
??????????????????? XHR = new ActiveXObject("Msxml2.XMLHTTP");
??????????????? }
??????????????? catch (e) {
??????????????????? try {
??????????????????????? XHR = new ActiveXObject("Microsoft.XMLHTTP");
??????????????????? }
??????????????????? catch (e) {
??????????????????? }
??????????????? }
??????????? }
??????? }
??????? return XHR;
??? };
??? var processParams = function () {
??????? var ret = "";
??????? for (var p in params) {
??????????? ret += "&";
??????????? ret += p + "=" + params[p];
??????? }
??????? ret = ret.substring(1);
??????? return ret;
??? };
??? var method = (url.indexOf("?") == -1) ? "POST" : "GET";
??? if (params && typeof (params) == "object") {
??????? if (typeof (params) == "object") {
??????????? if (method == "GET") {
??????????????? url += "&" + processParams();
??????????? } else {
??????????????? sendData = processParams();
??????????? }
??????? }
??????? if (typeof (params) == "string") {
??????????? if (method == "GET") {
??????????????? url += "&" + params;
??????????? } else {
??????????????? sendData = params;
??????????? }
??????? }
??? }
??? var xhr = createXHR();
??? xhr.open(method, url, true);
??? if (method == "POST") {
??????? xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
??? }
??? xhr.onreadystatechange = function () {
??????? if (xhr.readyState == 4) {
??????????? if (xhr.status == 200) {
??????????????? if (callback) {
??????????????????? callback(xhr);
??????????????? }
??????????? } else {
??????????????? window.alert(reqError);
??????????? }
??????? }
??? };
??? xhr.send(sendData);
};
function timer() {
??? var d = new Date();
??? document.getElementById("timer").innerHTML = d.toLocaleString();
}
//window.setInterval("timer()", 1000);

热点排行