1. 论坛系统升级为Xenforo,欢迎大家测试!
    Dismiss Notice

[存档]为了弄导航下拉菜单。弄了一个控制DIV相对位置的js函数。

Discussion in '前端开发' started by 风狼, Mar 24, 2008.

  1. 风狼

    风狼 New Member

    Joined:
    Oct 1, 2005
    Messages:
    7,452
    Likes Received:
    25
    function show(strId,w,h,divId)
    {
    var objId=strId;
    var objDiv = document.getElementById(strId);
    var docScrollLeft = document.body.scrollLeft;
    var docSrollTop = document.body.scrollTop;
    var e = objDiv;
    var t = e.offsetTop;
    var l = e.offsetLeft;
    while(e = e.offsetParent){
    t += e.offsetTop;
    l += e.offsetLeft;
    }
    l=l+w;
    t=t+h;
    var showId=document.getElementById(divId);
    showId.style.visibility="";
    showId.style.display="";
    showId.style.left=l;
    showId.style.top=t;
    }

    strId:目标物体的id号
    w:与目标物体x轴的偏差(第二级菜单与目标物体x轴的补差)
    h:与目标物体y轴的偏差(第二级菜单与目标物体y轴的补差)
    divId:隐藏的第二级菜单div的id名称


    例:
    <table>
    <tr>
    <td id="up" onMouseOver="show('up',0,28,'up1');" onMouseOut="hide('up1');" width="80">Product</td>
    </tr>
    </table>
    <div id="up1" style="visibility: hidden;display: none;" onmousemove="show('up',0,28,'up1')" onmouseout="hide('up1')">xxxx</div>

    up1的显示位置与id为up的相对。x轴偏差为0,y轴为28,这样就成了一个纵向的下拉菜单效果

    ----------------------------
    看别人的下拉菜单头晕的要死。自己东凑西拼。写了上面这个函数。初步解决了不同分辨率下DIV错位的问题。
     
  2. A君

    A君 Well-Known Member

    Joined:
    Aug 31, 2005
    Messages:
    19,987
    Likes Received:
    98
    技术贴。
     
  3. QinQi

    QinQi New Member

    Joined:
    Jun 21, 2007
    Messages:
    849
    Likes Received:
    0
    看不懂
     
  4. fyfei

    fyfei New Member

    Joined:
    Oct 7, 2005
    Messages:
    9,067
    Likes Received:
    46
    留脚印