zoukankan      html  css  js  c++  java
  • 拖动的层的javascript实现

    <HTML> 
    <HEAD>
     
    <SCRIPT>
    var defSelectContorl = null,charSelectContorl = null,datetimeSelectContorl = null;
    function filter( a0 )
    {
     d 
    = 0;
     cY 
    = -1;
     cX 
    = -1;
     
    var srcObj = window.event.srcElement;
     
    var objDiv = document.getElementById("table1");
     objDiv.style.pixelTop 
    = window.event.y - srcObj.offsetTop + srcObj.parentNode.offsetHeight;
     objDiv.style.pixelLeft 
    = window.event.x - srcObj.offsetLeft;
     objDiv.style.display 
    = "block";
     alert( objDiv.outerHTML);
    }
    //***********move filter Div code..
    var d = 0,cX = -1,cY = -1;
    var curObj;
    function MD( objID )
    {
     curObj 
    = document.getElementById( objID );
      d 
    = 1;
    }
    function MU()
    {
     d 
    = 0;
     cY 
    = -1;
     cX 
    = -1;
    }
    function MM()
    {
     
    if( d == 0 )
     {
      
    return;
     }
     
    var objDiv = document.getElementById( curObj.id );
     
    var intTop = window.event.clientY;
     
    var intLeft = window.event.clientX;
     
    if( cX == -1 )
     {
      cY 
    = intTop - objDiv.style.pixelTop;
      cX 
    = intLeft - objDiv.style.pixelLeft;
     }
     objDiv.style.pixelTop  
    = intTop - cY;
     objDiv.style.pixelLeft 
    = intLeft - cX;
     window.event.cancelBubble 
    = false;
     window.event.returnValue 
    = false;
    }
    //***********move filter Div code end..
    </SCRIPT>
    </HEAD>
    <BODY onMouseMove="JavaScript:MM()" >
    <div style="CURSOR:move; POSITION:absolute; z-index:7;">
    <TABLE ID="table1" BORDER COLS=3  style="  POSITION:absolute;z-index:7;font-size:12px;background:#ef9b5b;">
    <tr><td colspan="2" id="filterTitle" 
    style
    ="cursor:move;border-bottom:#333333 1px solid;height:23px;background:#ef9b5b; "
     onMouseDown
    ="JavaScript:MD('table1')" onMouseUp="JavaScript:MU()"></td></tr>
    <TR><TD>Column 1</TD><TD>Column 2</TD></TR>
    </TABLE>
    </div>
    </body>
    </html>
  • 相关阅读:
    b_lc_长度为 3 的不同回文子序列(统计两个相同字符中间有多少个不同字符)
    b_lc_最小未被占据椅子的编号(记录每个时间来的人 + pq)
    b_lc_统计好数字的数量(排列数+组合数+快速幂)
    TreeMap
    LinkedHashMap
    HashMap的总结
    HashMap
    Collection
    Map
    LinkedList学习
  • 原文地址:https://www.cnblogs.com/ymyglhb/p/1263615.html
Copyright © 2011-2022 走看看