元素拖拽

<div class = "container" >
    <div id="move" style="position:absolute; width:100px; height:100px; background:greenyellow">
    </div>
</div>
<script type="text/javascript">
    var dragging=null,tLeft,tTop,moveElem=document.getElementById("move");
    document.addEventListener("mousedown", function (event) {
        if(event.target==moveElem){
            dragging=true;
            var target=event.target;
            tLeft=event.clientX-target.offsetLeft;
            tTop=event.clientY-target.offsetTop;
        }
    });
    document.addEventListener("mouseup", function (e) {
        dragging=false;
    });
    document.addEventListener("mousemove", function (e) {
        if(dragging){
            var moveX= e.clientX-tLeft,
                    moveY= e.clientY-tTop;
            moveElem.style.left=moveX+"px";
            moveElem.style.top=moveY+"px";
        }
    });
</script>