raphael - RaphaelJs Drag constraints

Question

I have a slider in which I want to be able to drag in the x-co ordinate only and and set constraints beyond which the shape cant be dragged (the shape shouldn't go beyond the line in both the directions). How can it be achieved?

JS Fiddle Link

window.onload = function(){    

    var paper = Raphael(0,0,700,150);  

    var sliderline = paper.rect(68,100,606,1).attr({fill:'red',stroke:'none'});
    var slider = paper.rect(100,98,18,7,4).attr({fill:'#7cc576','stroke-width':'2','stroke':'white'}).glow({width:1,opacity:10,color:'green'});
}

​</p>

Answer 1

ハンドラーをドラッグイベントに割り当てることから始めます。ハンドラー内では、スライダーを好きなように動かすことができます。