Biraz oynadım kodlarla umarım yardımcı olur...
<style type="text/css">
body {
font:76% normal verdana,arial,tahoma;
}
h1, h2 {
font-size:1em;
}
#fooObject {
position:absolute;
left:0px;
top:8em;
width:5em;
line-height:3em;
background:#99ccff;
border:1px solid #003366;
white-space:nowrap;
padding:0.5em;
}
</style>
<script type="text/javascript">
var foo = null;
function doMoveLeft() {
foo.style.left = parseInt(foo.style.left) -10 + 'px';
startMove("left");
}
function doMoveRight() {
foo.style.left = parseInt(foo.style.left) +10 + 'px';
startMove("right");
}
function stopMove()
{
clearTimeout(t);
}
function startMove(yon){
if(yon == "left") t = setTimeout(doMoveLeft,20);
if(yon == "right") t = setTimeout(doMoveRight,20);
}
function init() {
foo = document.getElementById('fooObject');
foo.style.left = '0px';
doMoveRight();
}
window.onload = init;
</script>
<h1>kaçan div</h1>
<div id="fooObject">
kaçkaç
</div>
<input type="button" onclick="startMove('right');" value="Yürrüü">
<input type="button" onclick="startMove('left');" value="Dön Geri">
<input type="button" onclick="stopMove();" value="Duuuur">