1.尼玛, move事件的时候忘了加ev,找了一个多小时

<!DOCTYPE html>

<html>

<head lang="en">

    <meta charset="UTF-8">

    <title></title>

    <style>

        *{margin: 0; padding: 0}

        #div1{width: 100px; height: 100px; background: red; position: absolute; left: 100px;

            top: 100px;}

    </style>

    <script src="jquery-1.12.3.min.js"></script>

    <script>

        $(function(){

            var disX = 0;

            var disY = 0;

            var $div1 = $("#div1");

            $div1.on('mousedown',function(ev){

                disX = ev.pageX - $(this).offset().left;

                disY = ev.pageY - $(this).offset().top;

                $(document).on('mousemove',function(ev){//此处忘了加ev, 找了一个多小时!

                    var left = ev.pageX - disX;

                    var top = ev.pageY - disY;

                    console.log(left+":"+top)

                    $div1.css('left',left);

                    $div1.css('top',top );

                });

                $(document).on('mouseup',function(){

                    console.log("off")

                    $(this).off();

                });

                return false;//按下的时候阻止默认事件

            })

        });

    </script>

</head>

<body style="height: 2000px">

    <div id="div1">divdiv</div>

</body>

</html>

　　

jq 拖拽的更多相关文章

  1. 27、 jq 拖拽

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  2. jq拖拽插件

    (function ($) { var move = false; //标记控件是否处于被拖动状态 var dragOffsetX = 0; //控件左边界和鼠标X轴的差 var dragOffset ...

  3. Jquery拖拽，拖动排序插件

    上github搜jquery-sortable <!-- jq拖拽排序 --> <script src="${contextPath}/static/excelTable/ ...

  4. jQ插件--时间线插件和拖拽API

    这个时间轴是工作上用到的,自己写了一个, qq空间有时间轴的控件, 百度文库也有时间轴的控件: 百度的时间轴大概是这样的: 用户点击对应的锚链接,  那个三角会滚动, 然后左侧的界面也会滚动: 实际的 ...

  5. JQ实现3D拖拽效果

    <!DOCTYPE HTML> <html onselectstart='return false'> <head> <meta http-equiv=&qu ...

  6. 基于 jq 实现拖拽上传 APK 文件，js解析 APK 信息

    技术栈 jquery 文件上传:jquery.fileupload,github 文档 apk 文件解析:app-info-parser,github 文档 参考:前端解析ipa.apk安装包信息 - ...

  7. jq实现拖拽

    $("body").delegate( ".msg-layer",{ mousedown: function (e) { var el = $(".m ...

  8. Jquery 多行拖拽图片排序 jq优化

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  9. 不断优化，重构我的代码-----拖拽jquery插件

    最近学东西学的有点太散了,歇一阵子,重新完善之前的JQ插件,今天先上拖拽吧 // JavaScript Document (function($){ var defaults = { actionEl ...

随机推荐

  1. thinkphp框架中session常识

    在看别人代码时候,发现他,在tp框架中使用session没有些session_start();然后我去查看了手册初始化设置方法 无需手动调用,在App类的初始化工作结束后会自动调用,通常项目只需要配置 ...

  2. windows渗透被人忽视的一些小命令

    cmdkey /list 可以列出域内网之间可用的凭据. wmic   useraccount get name,sid gpresult /r

  3. post可以直接把get请求代入到目标url中

    Feigong --非攻 非攻 取自<秦时明月>--非攻,针对不同情况自由变化的武器 Feigong,针对各种情况自由变化的mysql注入脚本 Feigong,In view of the ...

  4. java中.equals和==的区别？

    Java中的equals是十分重要的,和= =要区别开来,孙卫琴的JAVA面向对象编程一书对这个做了阐述,现在小结其主要内容,而且要将 = =和 equals列为重要的对比概念来学习 1.声明格式   ...

  5. LeetCode | Unique Paths【摘】

    A robot is located at the top-left corner of a m x n grid (marked ‘Start’ in the diagram below). The ...

  6. 重命名Administrator账号

    (Get-WmiObject -class Win32_UserAccount | where {$_.SID -Like 'S-1-5-*-500'}).Rename("Ultraman& ...

  7. SonarQube代码质量管理平台安装与使用

    Sonar简介 Sonar是一个用于代码质量管理的开源平台,用于管理源代码的质量,可以从七个维度检测代码质量 通过插件形式,可以支持包括java,C#,C/C++,PL/SQL,Cobol,JavaS ...

  8. tomcat从下载到使用

    话说,某天正在和周公聊天下大事.被急促的电话铃声召唤回来,所谓江湖救急,于是远程一看.竟然是需要使用tomcat(汤姆家的猫),于是... 下面关于下载和配置tomcat的过程. ①.使用tomcat ...

  9. 转载：C/C++源代码到可执行程序的过程详解

    C/C++源代码到可执行程序的过程详解 编译,编译程序读取源程序(字符流),对之进行词法和语法的分析,将高级语言指令转换为功能等效的汇编代码,再由汇编程序转换为机器语言,并且按照操作系统对可执行文件格 ...

  10. [源码]随机获取虾米音乐song_id API文件

    [源码]随机获取虾米音乐song_id API文件 January 11, 2015 注意:此API请放置于国内主机使用,如香港.北京等等,否则会提示:虾米音乐在您所处的国家或地区暂时无法使用 < ...