zoukankan      html  css  js  c++  java
  • 文本框位置

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" lang="gb2312">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=GB2312" />
    <title>控件位置</title>
    <style type="text/css">
    <!--
    #s {
     font-size: 9pt;
     100px;
     background-color:#CCCCCC;
     height:200px;
     position:absolute;
     display:none;
    }
    -->
    </style>
    </head>
    <body>
    <table border=1 width="500" height="500" cellpadding=0 cellspacing=0>
    <tr>
    <td align="center">
    <div id="s" style="background:silver;cursor:hand">
    Click here to show.
    </div>
    <input type="text" name="textfield" onclick="show(this)" /></td></tr>
    </table>
    <script language="Javascript">
    var sUserAgent = navigator.userAgent;
    var isOpera = sUserAgent.indexOf("Opera") > -1;
    var isIE = sUserAgent.indexOf("compatible") > -1 && sUserAgent.indexOf("MSIE") > -1 && !isOpera;

    function getAbsoluteOffsetTop(obj) {
    var y = obj.offsetTop;
    while (obj = obj.offsetParent) y += obj.offsetTop;
    if(isIE){return y+21;}
    else{return y+21+"px";}
    }

    function getAbsoluteOffsetLeft(obj) {
    var x = obj.offsetLeft;
    while (obj = obj.offsetParent) x += obj.offsetLeft;
    if(isIE){return x;}
    else{return x+"px";}
    }

    function show(obj)
    {
    var x=getAbsoluteOffsetTop(obj);
    var y=getAbsoluteOffsetLeft(obj);

    var s=document.getElementById("s");
    s.style.display = "block";
    s.style.top=x;
    s.style.left=y;
    }
    </script>
    </body>
    </html>

  • 相关阅读:
    脚本化css 脚本化内联样式 脚本化css类
    jquery插件,表单验证validation plugin的使用
    跨域
    自己做的一个可以用在pc端移动端上点星星评论
    优化Jquery,提升网页加载速度
    编写灵活、稳定、高质量的 HTML 和 CSS 代码的规范
    eclipse编辑js很慢
    sortable bootstrap
    draggable,droppable
    eclipse配置
  • 原文地址:https://www.cnblogs.com/toosuo/p/963147.html
Copyright © 2011-2022 走看看