下拉菜单居中问题，急

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD><BODY>
<select id=s1>
<option>awfeaw</option>
<option>w</option>
<option>wwegwwwwwwwwweeee</option>
</select><script>
var sObj=document.getElementById('s1')
var maxLen=0
for(var i=0;i<sObj.all.length;i++)
maxLen=sObj.all[i].text.length>maxLen?sObj.all[i].text.length:maxLen

for(var i=0;i<sObj.all.length;i++){
var str=""
for(var j=0;j<(maxLen-sObj.all[i].text.length);j++) str+=" "
sObj.all[i].text=str+sObj.all[i].text
}
</script></BODY>
</HTML>

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

源代码如下，大家帮我看看var bw = new function(){
this.ua = window.navigator.userAgent.toLowerCase();
this.dom = document.getElementById ? 1 :0;
this.moz = this.ua.match(/gecko/i) ? 1 : 0;
this.ie  = this.ua.match(/msie/i) ? 1 : 0;
this.opera = !this.ie && !this.moz && this.ua.match(/opera/i) ? 1 : 0;
};
/* *//*
* global function handler
*/var posLib = {
getLeft :function(el) { return el == null ? 0 : (el.offsetLeft + this.getLeft(el.offsetParent)) },
getTop :function(el) { return el == null ? 0 : (el.offsetTop + this.getTop(el.offsetParent)) },
getWidth :function(el) { return el.offsetWidth },
getHeight :function(el) { return el.offsetHeight },
getRect :function(el) {
return {
left :this.getLeft(el),
top :this.getTop(el),
width :this.getWidth(el),
height :this.getHeight(el)
}
},
getInnerRect:function(el) {
return {
left :el.offsetLeft,
top :el.offsetTop,
width :el.offsetWidth,
height :el.offsetHeight
}
},
getStyle :function(el, prop) {
if (el.currentStyle)
return el.currentStyle[prop];
else if (window.getComputedStyle)
return window.getComputedStyle(el, null).getPropertyValue(prop.replace(/([A-Z])/g, '-$1').toLowerCase());
else
return el.style[prop];
},
getBorder :function(el) {
return {
left :parseInt(this.getStyle(el, "borderLeftWidth")) || 0,
top :parseInt(this.getStyle(el, "borderTopWidth")) || 0,
right :parseInt(this.getStyle(el, "borderRightWidth")) || 0,
bottom :parseInt(this.getStyle(el, "borderBottomWidth")) || 0
}
},
getDocRect :function() {
return {
left :document.documentElement.scrollLeft || document.body.scrollLeft || window.pageXOffset || window.scrollX||0,
top :document.documentElement.scrollTop || document.body.scrollTop || window.pageYOffset || window.scrollY||0,
width :document.documentElement.clientWidth || document.body.clientWidth || window.innerWidth || document.width||0,
height :document.documentElement.clientHeight || document.body.clientHeight || window.innerHeight || document.height||0
}
}
};
var $global = {
_idCounter :0,
_idPrefix :"CM",
all :new Array(),
getId :function() {
return this._idPrefix + this._idCounter++;
},
fire :function(id, e, $e) {
return this.all[id]['_' + e]($e);
}
};
/*
* WebFBMenuConfig
*/
var WebFBMenuConfig = {
basePath :"images/",
arrowRightIcon :"arrow.right.gif",
arrowDownIcon :"arrow.down.gif",
arrowWidth :16,
arrowHeight :16,
css :"MenuItem",
hoverCss :"MenuItem-hovered",
text :"Noname",
href :"javascript:void(0)",
target :"_blank",
dir :"vertical",
width :155,
height :20,
marginLeft :-3,
marginTop :3,
showTimeDelay :200,
hideTimeDelay :0,
hideSelect :bw.ie
};/*
* WebFBMenuIcon
*/
function WebFBMenuIcon(src, width, height) {
var oImage = new Image(width, height);
oImage.src = src;
this.src = oImage.src;
this.width = width || 16;
this.height = height || 16;
};/*
* WebFBMenuItem
*/
function WebFBMenuItem(sText, sHref, sTarget, sTitle, oImage, width, height, css, hoverCss) {
this.text = sText || WebFBMenuConfig.text;
this.href = sHref || WebFBMenuConfig.href;
this.target = sHref ? (sTarget || WebFBMenuConfig.target) : "_self";
this.title = sTitle || this.text;
this.image = oImage instanceof WebFBMenuIcon ? oImage : null;
this.width = width || WebFBMenuConfig.width;
this.height = height || WebFBMenuConfig.height;
this.css = css;
this.hoverCss = hoverCss;
this.level = 0;
this.order = 0;
this.items = new Array();
this.parentItem = null;
this.visible = false;
this.shown = false;
this.id = $global.getId();
$global.all[this.id] = this;
};WebFBMenuItem.prototype.add = function(subItem) {
subItem.order = this.items.length;
subItem.parentItem = this;
this.items[subItem.order] = subItem;
return subItem;
};WebFBMenuItem.prototype.getParent = function(level){
var oItem = this;
while (oItem != null && oItem.level>level)
oItem = oItem.parentItem;
return oItem;
};WebFBMenuItem.prototype.dispose = function() {
for (var i=0; i<this.items.length;i++)
this.items[i].dispose();
var el = document.getElementById(this.id);
if (el && el.parentNode)
el.parentNode.removeChild(el);
if (this.parentItem != null)
delete this.parentItem.items[this.order];
delete $global.all[this.id];
};WebFBMenuItem.prototype.toString = function() {
this.visible = !this.level;
this.dir = this.parentItem.dir;
if (this.level == 1 && this.order == 0 && this.dir == "vertical")
this.width = Math.max(this.width, this.parentItem.width);
else if (this.level && this.order || this.dir != "vertical")
this.width = this.parentItem.items[0].width; this.css = this.css || WebFBMenuConfig['css'+this.level] || WebFBMenuConfig.css;
this.hoverCss = this.hoverCss || WebFBMenuConfig['hoverCss'+this.level] || WebFBMenuConfig.hoverCss;
var label = String(this.text).replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">");
var arrow = new WebFBMenuIcon(WebFBMenuConfig.basePath + (this.dir == "horizontal" ? WebFBMenuConfig.arrowRightIcon : (! this.level ? WebFBMenuConfig.arrowDownIcon : WebFBMenuConfig.arrowRightIcon)), WebFBMenuConfig.arrowWidth, WebFBMenuConfig.arrowHeight); var str = '<a id="' +
this.id + '" class="' +
this.css + '" href="' +
this.href + '" target="' +
this.target + '" unselectable="on" tabindex="-1" onmouseover="$global.fire(this.id, \'onmouseover\')" onmouseout="$global.fire(this.id, \'onmouseout\')" onclick="return($global.fire(this.id,\'onclick\'))" oncontextmenu="return false" hideFocus="true" style="position:absolute;width:' +
this.width + 'px;height:' +
this.height + 'px;visibility:' +
(this.visible?'visible':'hidden') + ';z-index:' +
(this.level + 9999) + ';left:-9999px;top:-9999px;overflow:hidden;box-sizing:border-size;-moz-box-sizing:border-size"><div style="padding:2px 15px 2px 21px" nowrap="true">' +
label + '</div>' +
(this.image ? ('<img src="' + this.image.src + '" style="position:absolute;border:0px;width:' +
this.image.width + 'px;height:' +
this.image.height + 'px;top:' +
Math.round((this.height - this.image.height)/2) + ';left:3px;" align="absmiddle">') : '' ) +
(this.items.length ? ('<img src="' +
arrow.src + '" style="position:absolute;border:0px;width:' +
arrow.width + 'px;height:' +
arrow.height + 'px;top:' +
Math.round((this.height - arrow.height)/2) + 'px;right:2px">'):'')+'</a>'; for (var i=0; i<this.items.length; i++) {
this.items[i].level = this.level + 1;
str += this.items[i];
} return str;
};WebFBMenuItem.prototype._onmouseover = function() {
if (!this.visible) return;
var mb = this.getParent(-1);
if (mb != null && mb._hideTimer != null)
window.clearTimeout(mb._hideTimer); for (var i=0; i<this.parentItem.items.length; i++) {
var mi = this.parentItem.items[i];
if (mi.items.length > 0 && i != this.order && mi.shown) {
this.parentItem.items[i].hideAllSubs();break;
}
}
for (var i=0; i<this.items.length; i++)
this.items[i].hideAllSubs(); document.getElementById(this.id).className = this.hoverCss;
if (this.items.length && !this.shown) {
mb._showTimer = window.setTimeout('$global.all["' + this.id + '"]._over()', WebFBMenuConfig.showTimeDelay);
}
};WebFBMenuItem.prototype._onmouseout = function() {
var mb = this.getParent(-1);
if (mb != null && mb._showTimer != null)
window.clearTimeout(mb._showTimer); mb._hideTimer = window.setTimeout('$global.all["' + this.id + '"]._out()', WebFBMenuConfig.hideTimeDelay);
if (this.items.length && !this.shown || this.items.length==0)
document.getElementById(this.id).className = this.css;
};
WebFBMenuItem.prototype._onclick = function() {
if (typeof(this.href) == 'string')
return true;
else if (typeof(this.href) == 'function') {
this.href();
return false;
}
};WebFBMenuItem.prototype._over = function() {
this.display(true);
};WebFBMenuItem.prototype._out = function() {
this.getParent(0).hideAllSubs();
if (WebFBMenuConfig.hideSelect)
ShowElements();
};WebFBMenuItem.prototype.hide = function(){
for (var i=0; i<this.items.length; i++) {
if (this.items[i].visible)
this.items[i].hide();
}
if (this.visible)
this.setVisible(false);
document.getElementById(this.id).className = this.css;
this.shown = false;
};WebFBMenuItem.prototype.hideAllSubs = function(){
for (var i=0; i<this.items.length; i++) {
if (this.items[i].visible)
this.items[i].hide();
}
document.getElementById(this.id).className = this.css;
this.shown = false;
};WebFBMenuItem.prototype.getCss = function() {
var css = this.css || WebFBMenuConfig['css'+this.level] || WebFBMenuConfig.css;
var hcss = this.hoverCss || WebFBMenuConfig['hoverCss'+this.level] || WebFBMenuConfig.hoverCss;
return [css, hcss];
};WebFBMenuItem.prototype.setVisible = function(b){
var menuEl = document.getElementById(this.id);
if (menuEl.filters && menuEl.filters[0]) {
menuEl.filters[0].Stop();
menuEl.filters[0].Apply();
this.visible = b;
menuEl.style.visibility = b ? "visible" : "hidden";
menuEl.filters[0].Play();
}
else {
this.visible = b;
menuEl.style.visibility = b ? "visible" : "hidden";
}
};WebFBMenuItem.prototype.display = function(b){
var d = this.level == -1 && this.dir == "vertical";
var oDoc = posLib.getDocRect();
var width = 0, height = 0, left, top, x, y;
var pRect, rRect for (var i=0; i<this.items.length; i++) {
var mi = this.items[i];
var oEl = document.getElementById(mi.id);
var miRect = posLib.getInnerRect(oEl);
var miBorder = posLib.getBorder(oEl);
if (d) {
width += miRect.width;
height = Math.max(height, miRect.height);
if (i>0) width -= miBorder.left;
}
else {
width = Math.max(width, miRect.width);
height += miRect.height;
if (i>0) height -= miBorder.top;
}
} if (this.level == -1) {
left = this.left;
top = this.top;
}
else if (this.level == 0 && this.dir == "vertical") {
pRect = posLib.getInnerRect(document.getElementById(this.id));
left = pRect.left;
top = pRect.top + pRect.height;
}
else {
pRect = posLib.getInnerRect(document.getElementById(this.id));
left = pRect.left + pRect.width + WebFBMenuConfig.marginLeft;
top = pRect.top + WebFBMenuConfig.marginTop; if (top + height > oDoc.top + oDoc.height)
top = oDoc.top + oDoc.height - height;
if (top < oDoc.top)
top = oDoc.top; if (width + left > oDoc.left + oDoc.width)
left = pRect.left - width - WebFBMenuConfig.marginLeft;
if (left < oDoc.left)
left = oDoc.left;
} for (var i=0; i<this.items.length; i++) {
var mi = this.items[i];
var miEl = document.getElementById(mi.id);
var oBorder = posLib.getBorder(miEl);
var x = left, y = top;
if (i > 0) {
if (this.level != -1 || this.dir != "vertical")
y = rRect.top + rRect.height - oBorder.top;
else
x = rRect.left + rRect.width - oBorder.left;
}
else if (this.level == 0 && this.dir == "vertical")
y = top - oBorder.top; miEl.style.left = x + "px";
miEl.style.top = y + "px";
rRect = posLib.getInnerRect(miEl);
rRect.left = x;
rRect.top = y;
if (b) mi.setVisible(true);
}
if (WebFBMenuConfig.hideSelect)
HideElements(left, top, width, height);
this.shown = true;
};
function WebFBMenu() {
this.left = 0;
this.top = 0;
this.dir = WebFBMenuConfig.dir;
this.level = -1;
this.items = new Array();
this._element = null;
this._showTimer = null;
this._hideTimer = null;
this._loaded = false;
};WebFBMenu.prototype.add = WebFBMenuItem.prototype.add;
WebFBMenu.prototype.display = WebFBMenuItem.prototype.display;WebFBMenu.prototype.setPosition = function(oEl){
this._element = oEl;
var self = this;
if (window.onresize) {
var oldOnresize = window.onresize;
window.onresize = function() {
oldOnresize();
self.fixPosition();
}
} else {
window.onresize = function() {
self.fixPosition()
}
}
this.fixPosition();
};WebFBMenu.prototype.fixPosition = function(){
var oRect = posLib.getRect(this._element);
this.left = oRect.left;
this.top = oRect.top;
if (this._loaded) this.display();
};WebFBMenu.prototype.dispose = function() {
for (var i=0; i<this.items.length; i++)
this.items[i].dispose();
this._element = null;
this.fixPosition = function(){};
};WebFBMenu.prototype.toString = function() {
var str = [];
for (var i=0; i<this.items.length; i++)
str[i] = this.items[i].toString();
return str.join('');
};WebFBMenu.prototype.write = function(el) {
if (!bw.dom) {
window.alert("Please install a DOM supported browser for WebFBMenu.");
return;
}
el.innerHTML = this.toString();
this._loaded = true;
this.display();
};
/*
public function of hiding 'SELECT','IFRAME','OBJECT','APPLET'
*//*
hide objects
*/
function HideElements(x, y, w, h) {
if (!window.__temp__) window.__temp__ = new Array();
var o = ["select","iframe","applet","object"];
for (var i=0; i<o.length; i++) {
var elms = document.getElementsByTagName(o[i]);
for (var j=0; j<elms.length; j++) {
var p = getPosition(elms[j]);
if (x + w > p.left && x < p.left + p.width &&
y + h > p.top && y < p.top + p.height) {
window.__temp__[window.__temp__.length] = elms[j];
elms[j].style.visibility = "hidden";
}
}
}
function getPosition(el) {
var e = el.offsetParent, x = el.offsetLeft, y = el.offsetTop;
while (e.tagName != 'BODY') {
x += e.offsetLeft;
y += e.offsetTop;
e = e.offsetParent;
}
return {
"left": x,
"top": y,
"width": el.offsetWidth,
"height": el.offsetHeight
}
};
};
/*
show hidden objects
*/
function ShowElements() {
var oTemp = window.__temp__;
if (oTemp) {
for (var i=0; i<oTemp.length; i++)
oTemp[i].style.visibility = "visible";
}
};