zoukankan      html  css  js  c++  java
  • jQuery拖拽

    PC 端拖拽
    function drag() {
                var _move = false;
                var _x, _y;
                $(".drag").click(function() {
                    console.log($(".drag>g").css("display"));
                }).mousedown(function(e) {
     
                    _move = true;
                    _x = e.pageX - parseInt($(".drag").css("left"));
                    _y = e.pageY - parseInt($(".drag").css("top"));
     
                });
                $(document).mousemove(function(e) {
     
                    if(_move) {
                        var x = e.pageX - _x;
                        var y = e.pageY - _y;
                        $(".drag").css({
                            top: y,
                            left: x
                        });
                    }
                }).mouseup(function() {
                    _move = false;
                });
            }
     
    手机 端拖拽
    function drag(){
        var _move=false;
        var _x,_y;
        var drag = document.getElementById('drag');
     
        drag.addEventListener("touchstart",function(e){ 
          var touch = event.targetTouches[0];
          console.log(touch);
            _move=true; 
            _x=touch.pageX-parseInt($("#drag").css("left")); 
            _y=touch.pageY-parseInt($("#drag").css("top")); 
        }); 
        document.addEventListener("touchmove",function(e){ 
          var touch = event.targetTouches[0];
            if(_move){ 
                var x=touch.pageX-_x;
                var y=touch.pageY-_y; 
                $("#drag").css({top:y,left:x});
            } 
        })
        document.addEventListener("touchend",function(e){ 
          _move=false; 
          }); 
        }
  • 相关阅读:
    第二学期,第0次作业
    最后一次作业——总结报告
    第14、15周作业
    第七周作业
    第6周作业
    第四周作业
    “黄领衫”获奖感言
    2018上C语言程序设计(高级)作业- 第4次作业
    2018上C语言程序设计(高级)作业- 第3次作业
    2018上C语言程序设计(高级)作业- 第2次作业
  • 原文地址:https://www.cnblogs.com/wzy1569178479/p/7341315.html
Copyright © 2011-2022 走看看