SOURCE

(function(){
    var transform = getTransform();
    function Drag(selector){
        this.elem = typeof selector == 'object' ? selector : document.querySelector(selector);
        this.startX = 0;
        this.startY = 0;
        this.sourceX = 0;
        this.sourceY = 0;

        this.init();
    }

    Drag.prototype = {
        constructor: Drag,
        init: function(){
            this.setDrag()
        },
        getStyle: function(property){
            return document.defaultView.getComputedStyle?document.defaultView.getComputedStyle(this.elem, null)[property]:this.elem.currentStyle[property]; 
        },
        getPosition: function(){
            var pos = {x:0, y:0};
            var transform = getTransform();
            if(transform){
                var transformValue = this.getStyle('transform');
                if(transformValue == 'none'){
                    this.elem.style.transform = 'transform(0,0)';
                    return pos;
                }else{
                    var temp = transformValue.match(/-?\d+/g)
                    return pos = {
                        x: parseInt(temp[4].trim()),
                        y: parseInt(temp[5].trim())
                    }
                }
            }else{
                if(this.getStyle(elem, 'positon') == 'static'){
                    elem.style.position = 'relative';
                    return pos;
                }else{
                    var x = parseInt(this.getStyle('left')?this.getStyle('left'):0)
                    var y = parseInt(this.getStyle('right')?this.getStyle('right'):0)
                    return pos = { 
                        x: x,
                        y: y
                    }
                }
            }
        },
        setPosition: function(pos){
            if(transform){
                this.elem.style['transform'] = 'translate('+pos.x+'px,'+pos.y+'px)'
            }else{
                this.elem.style.left = pos.x + 'px';
                this.elem.style.top = pos.y + 'px';
            }
        },
        setDrag: function(){
            var self = this;
            this.elem.addEventListener('mousedown', start, false);
            function start(event){
                self.startX = event.pageX;
                self.startY = event.pageY;
                
                var pos = self.getPosition();
                self.sourceX = pos.x;
                self.sourceY = pos.y;                    
    
                document.addEventListener('mousemove', move, false);
                document.addEventListener('mouseup', end, false);
            }
    
            function move(event){
                var currentX = event.pageX;
                var currentY = event.pageY;
                var disX = currentX - self.startX;
                var disY = currentY - self.startY;
                self.setPosition({
                    x: (self.sourceX + disX).toFixed(),
                    y: (self.sourceY + disY).toFixed()
                })
            }
    
            function end(event){
                document.removeEventListener('mousemove', move);
                document.removeEventListener('mouseup', end);
            }
        }
    }

    function getTransform(){
        var transform = '',
            divStyle = document.createElement('div').style,
            _transforms = ['transform', 'webkitTransform', 'MozTransform', 'msTransform', 'OTransform'],
            i = 0,
            len = _transforms.length;
        for(;i < len; i++){
            if(_transforms[i] in divStyle){
                return transform = _transforms[i];
            }
        }
        return transform;
    }
    window.Drag = Drag;
})();

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
</head>
<body>
    <div id="dragObject">点击拖动</div>
    <script>new Drag('#dragObject')</script>
</body>
</html>

#dragObject{
    width: 100px;
    height: 100px;
    background: #aaa;
    cursor: pointer;
    position: relative;
    text-align:center;
    line-height: 100px;
    -webkit-user-select:none; //禁止用户选择文字
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;
}