js获取坐标然后用CSS定位DIV

Question

本帖最后由 haha1699 于 2009-08-13 10:26:52 编辑

Answer 1

以下这段代码实现div居中的功能,你参考下,
function adjustLocation()
    {
        var obox=document.getElementById('divBox');
        if (obox !=null && obox.style.display !="none")
        {
            var w=368;
            var h=129;
            var oLeft,oTop;
            
            if (window.innerWidth)
            {
                oLeft=window.pageXOffset+(window.innerWidth-w)/2 +"px";
                oTop=window.pageYOffset+(window.innerHeight-h)/2 +"px";
            }
            else
            {
                var dde=document.documentElement;
                oLeft=dde.scrollLeft+(dde.offsetWidth-w)/2 +"px";
                oTop=dde.scrollTop+(dde.offsetHeight-h)/2 +"px";
            }
            
            obox.style.left=oLeft;
            obox.style.top=oTop;
        }
    }

Answer 2

<script>
function doshow(obj){
var pad = document.getElementById("div1");
pad.style.left = getAbsPos(obj, "left")
pad.style.top = getAbsPos(obj,"top")+22
pad.style.display = "block";
var a = document.getElementsByTagName("select");
for(var i=0;i<a.length;i++) a[i].style.visibility = "hidden";
}
function dohide(){
var pad = document.getElementById("div1");
pad.style.display = "none";
var a = document.getElementsByTagName("select");
for(var i=0;i<a.length;i++) a[i].style.visibility = "visible";
}
function getAbsPos( oId, tl ) {
var o = ((typeof oId) == 'String') ? document.getElementById( oId ) : oId;
var val = 0;
while ( o.tagName.toLowerCase() != "body") {
val += (tl == 'top') ? parseInt( o.offsetTop ) : parseInt( o.offsetLeft );;
o = o.parentNode;
}
return val;
}
window.onload=function(){

}
</script><div id="div1" style="display:none;background:#CCC;width:200px;height:60px;position:absolute;z-index:10;left:0px;top:0px;">xx</div>
<input type="text" id="txt1" style="height:22px;" onclick="doshow(this)" onblur="dohide();"><br>
<input type="text" id="txt2"><br>
<input type="text" id="txt3"><br>
<select name="sel" style="width:200px"></select>

Answer 3

事件源是table布局 不是CSS布局 CSS布局已有解决方案

Answer 4

用JS定位 var absPosition = function(element){
var iTop = iLeft = 0;
do{
iTop += element.offsetTop;
iLeft += element.offsetLeft;
}while(element = element.offsetParent);
return {'x': iLeft, 'y': iTop};
 }
//日历控件.style.x = absPostion(输入框).x + "px"
//日历控件.style.y = (absPostion(输入框).y + 输入框.offsetHeight) + "px"