zoukankan      html  css  js  c++  java
  • 页面拖拽效果

    今天需要做一个悬浮效果,做了一个简单的拖拽

    <script language="javascript">
    var firstX=0; var firstY=0;
    var relativeX=0; var relativeY=0;
    var move=false;
        //mouse position
        function mouseCoords()
        {
         var ev = ev || window.event;
         if(ev.pageX || ev.pageY){
          return {x:ev.pageX, y:ev.pageY};
         }
         return {
          x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,
          y:ev.clientY + document.body.scrollTop  - document.body.clientTop
         };
        }

        function StartDrag(obj)
        {
            obj.setCapture();
            obj.style.background="#5684FE";
            relativeX=parseInt(mouseCoords().x)-parseInt(obj.style.left);
            relativeY=parseInt(mouseCoords().y)-parseInt(obj.style.top);
            move=true;
        }

        function Drag(obj)
        {
            if(move)
            {  
                obj.style.left=parseInt(mouseCoords().x)-parseInt(relativeX);
                obj.style.top=parseInt(mouseCoords().y)-parseInt(relativeY);
            }
        }

        function StopDrag(obj)
        {
            obj.style.background="#5684FE";
            obj.releaseCapture();
            move = false;
        }
    </script>

    <div runat="server" id="divInstance"  style="display: none; position: absolute;
        400px; height: 30px; top: 50px; left: 50px; z-index: 1000; background: #5684FE"
        onmousedown="StartDrag(this)" onmousemove="Drag(this)" onmouseup="StopDrag(this)">
        123456
    </div>

  • 相关阅读:
    Java高并发(1)
    Java基础知识之常见关键字(1)
    jQuery中attr()与prop()区别介绍
    win7下delphi中的help文档问题
    Delphi TMemo 可以显示、编辑多行文本
    TcxGrid
    Delphi学习手记——单引号和双引号的区别
    sql 系统表协助集合
    VCL安装有哪几种方法?
    sqlserver2008 服务器实例连接
  • 原文地址:https://www.cnblogs.com/cuihongyu3503319/p/1357729.html
Copyright © 2011-2022 走看看