drag in chrome

HTML

<div class="slider">
    <div class="handle"></div>
    <div class="dragger" draggable="true"></div>
    <div class="droptarget"></div>
</div>
<div id="result">0</div>

CSS

.slider{
    width:300px;
    height:20px;
    border:1px solid blue;
    position:relative;
}
.handle{
    width:10px;
    height:10px;
    z-index:5;
    position:absolute;
    top: 5px;
    left: 5px;
    border:1px solid red;
}
.dragger{
    position:absolute;
    z-index:100;
    width:10px;
    height:10px;
    top:5px;
    left:5px;
    border:1px solid yellow;
    opacity:0.5;
    cursor:pointer;
}
.droptarget{
    position:absolute;
    z-index:99;
    width:50px;
    height:50px;
    display:none;
    border:1px solid green;
}

JavaScript

(function setEvents(){
    var dragger=document.getElementsByClassName("dragger")[0];
    var result=document.getElementById("result");
    var handle=document.getElementsByClassName("handle")[0];
    var slider=document.getElementsByClassName("slider")[0];
    var dta=document.getElementsByClassName("droptarget")[0];
    var dropped=false;
    var oldX=[0,0];
    var startPos=0;
    var startY=0;
    dragger.onmousedown=function(evt){
        startPos=dragger.offsetLeft;
        startY=dragger.offsetTop;
    }
    dragger.ondragstart=function(evt){
        dropped=false;
        dta.style.display="block";
    }
    dragger.ondrag=function(evt){
        var newX=evt.offsetX+startPos;
        if((newX>0)&&(newX<slider.offsetWidth)){
            
            oldX.push(newX);
            oldX.shift();
        }
        newX=((oldX[1]<0)||(oldX[1]>slider.offsetWidth))?oldX[0]:oldX[1];
        handle.style.left=newX+"px";
        dta.style.left=newX-25+"px";
        dta.style.top=evt.offsetY-25+startY+'px';
    }
    dragger.ondragend=function(evt){
        result.innerHTML=startPos+evt.pageX;
        evt.preventDefault();
        dropped=true;
        handle.style.left=oldX[0]+'px';
        dragger.style.left=oldX[0]+'px';
        dta.style.display="";
    }
    dta.ondragover=function(evt){
        evt.preventDefault();
    }
    dta.ondragenter=function(evt){
        evt.preventDefault();
    }
}());