javascript原生 别让弹出层拖拽到外面去。 if判断写不好，求指点

问题描述

问 题

http://jsbin.com/hejilomola/edit?html,css,js,output
上面是demo.寻指导 。

        function mousemove(ev){
            if(ev==null) ev=window.event;//IE
//            var xx=$alert.style.left=(ev.clientX-x)+"px";
            var ff=0;
            if($alert.style.left>ff){
                $alert.style.left=(ev.clientX-x)+"px";
            }
//            console.log(xx);
            var yy=$alert.style.top=(ev.clientY-y)+"px";
            console.log(yy)
        }

解决方案

谢邀

在其他代码不变的情况下，修改拖拽逻辑，楼主试试把这个函数放到你的代码中，应该可以实现你的要求

function drag(obj) {
    var w = document.documentElement.clientWidth || document.body.clientWidth;
    var h = document.documentElement.clientHeight || document.body.clientHeight;
    var disX, disY, maxLeft, maxTop, left, top, tempLeft, tempTop;

    obj.onmousedown = function (ev) {
      maxLeft = (w - obj.offsetWidth);
      maxTop = (h - obj.offsetHeight);
      ev = ev || event;
      disX = ev.clientX - this.offsetLeft;
      disY = ev.clientY - this.offsetTop;

      document.onmousemove = function (ev) {
        ev = ev || event;

        tempLeft = ev.clientX - disX;
        tempTop = ev.clientY - disY;

        if(tempLeft < 0){
          left = 0;
        }else if(tempLeft >= maxLeft){
          left = maxLeft;
        }else{
          left = tempLeft;
        }

        if(tempTop < 0){
          top = 0;
        }else if(tempTop >= maxTop){
          top = maxTop;
        }else{
          top = tempTop;
        }

        obj.style.left = left + 'px';
        obj.style.top = top + 'px';
      }

      document.onmouseup = function () {
        this.onmousemove = this.onmouseup = null;
      }

      return false;
    }
   }

   drag(document.getElementById('content'));

这篇关于javascript原生 别让弹出层拖拽到外面去。 if判断写不好，求指点的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！