Saber 酱的抱枕

<div id="demo">
	<div class="scrollbox">
		<div id="demo1">
			<a href="">雪见雪见雪见雪见雪见雪见</a>
			<a href="">sabersabersabersaber</a>
		</div>
		<div id="demo2"></div>
	</div>
</div>
<style type="text/css">
	#demo{width: 300px;overflow:hidden;} /*最外层box的宽度可以随意设置，但必须小于里面demo(如demo1)的宽度，否则滚动完一次会停止*/
	#demo .scrollbox{width:1000%;}/*设置一个较大的范围，保证其宽度大于内部两个div宽度之和（如果宽度不够两个div就会错开）*/
	#demo1,#demo2{display: inline-block;}/*浮动或设置display以保持在同一行*/
</style>
<script type="text/javascript">
	var demo = document.getElementById("demo");
	var demo1 = document.getElementById("demo1");
	var demo2 = document.getElementById("demo2");
	demo2.innerHTML=document.getElementById("demo1").innerHTML;
	function Marquee(){
		if(demo.scrollLeft-demo2.offsetWidth>=0){
			demo.scrollLeft-=demo1.offsetWidth;
		}
		else{
			demo.scrollLeft++;
		}
	}
	var myvar=setInterval(Marquee,30);
	demo.onmouseout=function (){myvar=setInterval(Marquee,30);}
	demo.onmouseover=function(){clearInterval(myvar);}
</script>

我解释下dom结构:
id#demo是最外层，设置滚动区域的宽高。此代码中它的宽度需要比滚动内容的宽度小。
class.scrollbox是容纳两个滚动容器的，它的宽度需要设置得比较宽，以保证能容纳两个滚动内容。
id#demo1和#demo2就是滚动内容了，通过设置浮动或display让他们保持在同一行，循环滚动。

示例中给出的css样式都是基础的必须样式，如果需要其他样式请自行添加。

JavaScript无缝滚动一例