其实这效果用css3的animation就能办到，不过这里就当熟悉js的操作吧！

效果图如下：

html部分：

     
    
      
        
       
一行文字
    
      
     

.box这层div可以不用加，这里只是作为子绝父相的父元素罢了！当然，把游览器作为父元素也可以，只是想镶嵌到其他div中就麻烦了。

css部分：

*{
   margin: 0;padding: 0;}        .box{
               position: relative;            margin: 100px;            border: 1px solid #ccc;            width: 200px;            height: 500px;        }        #shengjiang{
               position: absolute;            color: #000;        }

如果是css3，就直接换成以下的就好了。

*{
   margin: 0;padding: 0;}        .box{
               position: relative;            margin: 100px;            border: 1px solid #ccc;            width: 200px;            height: 500px;        }        #shengjiang{
               position: absolute;            color: #000;            animation:mymove 5s infinite;        }        @keyframes mymove            {
                   0% {top:0px;}                50% {
   top:200px;}                100%{
   top: 0px;}            }

animation，css3的动画属性

mymove 定义的名称，可自定义。

5s 一次需要的时间

infinite 循环反复

@keyframes mymove 给上面定义的名称添加动画属性。

　　　　即0%时所在位置，50%时所在位置，100%时所在位置。

　　　　0-100%之间可任意分隔。

top 是从0到200px再回到0；

js部分，虽说到这里就已经达成效果了说……

var step = 4;        function anim(x,y){    //x为最等端，y为最底端            document.all["shengjiang"].style.top=x+"px";    //初始顶端位置            if (x>=y) {                step = -4;    //达到最底端时为负值，其数值表示每一次执行setTimeout时，移动的像素减少4像素，数值越大，移动的距离也就越大。每次调用时也就显得越快。            }            if (x<0) {    //这行的零所代表的，居然是与显示窗口（子绝父相的父级）相对高度                step = 4;    //如果到达指定高度时，数值为正，即加大参数向下移动            }            setTimeout('anim('+(x+step)+','+y+')', 35);    //等待多少秒执行，所以数值越小速度就越快            //        }        anim(5,200);//5只是初始位置，200才是整体的高度，至于如何确认最顶端，还要看if (x<0) {step = 4;}中的x<0中的0这个数值。