var jshFixPisition = function(target, pos) {
this.target = this.g(target);
this.pos = pos;
this.init(); //
};jshFixPisition.prototype = {
isScroll: navigator.userAgent.indexOf("MSIE 6") != -1 || (window.ActiveXObject && document.compatMode != "CSS1Compat"),
ae: function(e, call) {
if (window.addEventListener)
window.addEventListener(e, call, false);
else
window.attachEvent("on" + e, call);
},
g: function(id) {
return typeof (id) == "string" ? document.getElementById(id) : id;
},
setPos: function() {//设置位置
var de;
if (document.compatMode == "CSS1Compat") de = document.documentElement;
else de = document.body; if (typeof (this.pos) == "string") {//
if (!this.isScroll) {
switch (this.pos.charAt(0)) {
case "l":
this.target.style.left = "0px";
break;
case "r":
this.target.style.right = "0px";
break;
default:
this.target.style.left = (de.clientWidth - this.target.clientWidth) / 2 + "px";
break;
}
switch (this.pos.charAt(1)) {
case "t":
this.target.style.top = "0px";
break;
case "b":
this.target.style.bottom = "0px";
break;
default:
this.target.style.top = (de.clientHeight - this.target.clientHeight) / 2 + "px";
break;
}
} else {
switch (this.pos.charAt(0)) {
case "l":
this.target.style.left = de.scrollLeft + "px";
break;
case "r":
this.target.style.left = de.scrollLeft + de.clientWidth - this.target.clientWidth + "px";
break;
default:
this.target.style.left = de.scrollLeft + ((de.clientWidth - this.target.clientWidth) / 2) + "px";
break;
}
switch (this.pos.charAt(1)) {
case "t":
this.target.style.top = de.scrollTop + "px";
break;
case "b":
this.target.style.top = de.scrollTop + de.clientHeight - this.target.clientHeight + "px";
break;
default:
this.target.style.top = de.scrollTop + ((de.clientHeight - this.target.clientHeight) / 2) + "px";
break;
}
}
} else {
if (!this.isScroll) {
for (var p in this.pos)
this.target.style[p] = this.pos[p] + "px";
} else {
for (var p in this.pos) {
switch (p.toLowerCase()) {
case "left":
this.target.style.left = de.scrollLeft + this.pos[p] + "px";
break;
case "right":
this.target.style.left = de.scrollLeft + de.clientWidth - this.target.clientWidth - this.pos[p] + "px";
break;
case "top":
this.target.style.top = de.scrollTop + this.pos[p] + "px";
break;
case "bottom":
this.target.style.top = de.scrollTop + de.clientHeight - this.target.clientHeight - this.pos[p] + "px";
break;
}
}
}
}
},
init: function() {
if (!this.pos)
throw Error("Invalid arguments [pos].");
if (!this.isScroll)
this.target.style.position = "fixed";
else
this.target.style.position = "absolute";
var timer, o = this;
this.ae("resize", function() {//支持fixed的浏览器窗体大小改变时也重置位置,防止中间无法居中
clearTimeout(timer);
timer = setTimeout(function() {
o.setPos();
}, 30);
});
if (this.isScroll) {//滚动
this.ae("scroll", function() {
clearTimeout(timer);
timer = setTimeout(function() {
o.setPos();
}, 30);
});
}
this.setPos();
}
} 这是我从sky复制来的代码。。
我把他改了
发现
var timer, o = this;
this.ae("resize", function() {//支持fixed的浏览器窗体大小改变时也重置位置,防止中间无法居中
clearTimeout(timer);
timer = setTimeout(function() {
o.setPos();
}, 30); });
if (this.isScroll) {//滚动
this.ae("scroll", function() {
clearTimeout(timer);
timer = setTimeout(function() {
o.setPos();
}, 30);
}); }
(注意红色的地方)
问题:(1)为什么一定要加上延迟,否则在ie6里的宽度跟高度会无限延长?
(2)(!window.ActiveXObject)<=为什么不支持这个对象 就 一定不支持 fixed 这个css样式
然后如果不是(window.ActiveXObject检测是否是ie,如果 是ie,而且页面加了dtd才行,因为在ie7(这里8忘记了当时的结果了)中,只有加了dtd的页面才支持fixedps:这么晚还提问,太强悍了,
c++代码发现需要用js来处理,于是调用你的js,在调用完了,还是要返回给这个c++函数的,具体它还做了什么,你无从得知,或许会抵消setPos的行为。而setTimeout就能跳出这个事件处理函数来调用setPos。应该是个不符合w3c的bug。
我也是这样想,因为看你写的 qq有下角 效果 时是 !window.ActiveXObject ,
如果不加延迟的话 ,那么当他 缩小窗口直到有滚动条,然后 拉下面 的滚动条 到最 右边,
然后最大化,之后文档 的宽度 就变宽啦。。应该是 ClientWidth 变宽。
我感觉 是scroll 触发的 太快。(但到达最右的时候)
scroll事件 先 改变了ClientWidth,然后 再定位,
这样如果定义了坐标的话 那么 这个div 的坐标肯定比原来的scrollWidth 要宽的。
这个是在ie6才有的问题。。
不知道 是不是这样.
谢谢两位大哥 那么晚还帮忙回答问题