滚动的原理就是滚动条的移动，当外部区域设置为overflow:hidden，内部快如果超出外部的区域，此时就有滚动条了（只是你没看见而已），这是后只要n毫秒让滚动条移动n个像素，即可看到滚动效果，这时候当然用到var init = setTimeout()函数执行动作，停止滚动的时候就 clearInterval(init),就停止了。
这方面代码很多，一般写的很垃圾，自己明白了原理，写起来很简单，用jquery写就几行代码
我写的代码，要下班了，所以就简单注释一下。鼠标经过会停止，移开鼠标会继续走。已经测试过了。另存xx.htm打开可看效果。
<script type="text/javascript">var timer_movex
start_timer()
function start_timer(){
timer_movex = setInterval(function() {//setInterval是js循环定时器每隔一段时间就执行一次function代码
var x = document.getElementById('x')//获得id为x的html元素
if(x.offsetLeft >= 800)
x.style.left = 0//如果移动到了800的位置，则跳回左边0点重新开始移动
else
x.style.left = x.offsetLeft + 50//向右移动20个像素
}, 1000)//每隔1000毫秒移动一次
}
function stop_timer() {
clearInterval(timer_movex)
}
function movex(v) {
var x = document.getElementById('x')//获得id为x的html元素
x.style.left = x.offsetLeft + v//移动v个像素，v为正数则向右，负数则向左。x.style.left即为左边框位置。
}
</script>
<div id="x" style="position:absolute left:500px top:100px width:100px height:100px border=1px solid #000" onmouseover="stop_timer()" onmouseout="start_timer()">
<h1>TEST</h1>
</div>
<form>
<input id="test" onclick="movex(-100)" value="点击左移" type="button"/>
<input id="test" onclick="movex(100)" value="点击右移" type="button"/>
<input id="test" onclick="start_timer()" value="start" type="button"/>
<input id="test" onclick="stop_timer()" value="stop" type="button"/>
</form>
