How to make a button so that it can only be dragged to a certain extent?

[cnr sport]

I wanted to know if it was possible to make it so that when you mouseover a button to move it either to the right or to the left, it moved only 200px. So that once it is moved 200px it can't be moved another 200px, but once it is moved back to it's original position it can be moved 200px again. I have this javascript code\[code\] <script type="text/javascript" language="javascript">//<![CDATA[// window.onload=function() {// document.getElementById("d2").onmouseover = slideIt("toRight");// document.getElementById("d3").onmouseover = slideIt("toLeft");// };function slideIt(actionReturn) { var slidingDiv = document.getElementById("d1"); var stopPosition = 50; var startPosition = slidingDiv.offsetWidth+slidingDiv.offsetWidth; if (actionReturn == "toRight") { if (parseInt(slidingDiv.style.left) >= 0 ) { slidingDiv.style.left = parseInt(slidingDiv.style.left) - 200 + "px"; setTimeout(slideIt, 1); } } if (actionReturn == "toLeft") { if (parseInt(slidingDiv.style.left) < startPosition ) { slidingDiv.style.left = parseInt(slidingDiv.style.left) + 200 + "px"; setTimeout(slideIt, 1); } }}//]]></script>\[/code\]