Jquery文字一行一行向上滚动 效果是用了Jquery中animate这个方法实现的 相对来说是蛮简单的 虽然是简单点 还是要分享下 基本原理就是：运用了一个小技巧 滚动的高度和每个li的高度一样的，先找到外层ul的容器 然后相对于外层的容器进行向上滚动 ul在css里面没有设置他的高度 默认情况下是n个li×li的高度 向上是marginTop： -li.height(每个li的高度);
* 当滚动到最后一个li时候 那么最外层的容器应该滚动到0了 那么我就把第一个li加到ul里面去 这样就实现了循环滚动
* 而不会滚动到最后一个就停止下来了 基本的HTML/CSS如下

<!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01//EN""http://www.w3.org/TR/html4/strict.dtd"><html><head><metahttp-equiv="Content-Type"content="text/html;charset=utf-8"><title>UntitledDocument</title><styletype="text/css">ul,li{list-style:none;margin:0;padding:0;}.scroll{width:500px;height:175px;overflow:hidden;border:1pxsolid#333;margin:50pxauto0;}.scrollli{width:500px;height:25px;line-height:25px;overflow:hidden;}.scrolllia{font-size:14px;font-family:"宋体";color:#333;text-decoration:none;}.scrolllia:hover{text-decoration:underline;}</style><scripttype="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script></head><body><divclass="scroll"><ulclass="list"><li><ahref="#"target="_blank">我来博主的空间了</a></li><li><ahref="#"target="_blank">我来博主的空间了</a></li><li><ahref="#"target="_blank">我来博主的空间了</a></li><li><ahref="#"target="_blank">我来博主的空间了</a></li><li><ahref="#"target="_blank">我来博主的空间了</a></li><li><ahref="#"target="_blank">我来博主的空间了</a></li><li><ahref="#"target="_blank">我来博主的空间了</a></li></ul></div><scripttype="text/javascript"src="index.js"></script></body></html>

JS代码如下：

/***@authortugenhua*@emailtugenhua@126.com*一行一行文字向上滚动js*运用了Jquery中的animate动画方法*运用了一个小技巧滚动的高度和每个li的高度一样*先找到外层ul的容器然后相对于外层的容器进行向上滚动ul没有设置他的高度默认情况下是n个li×li的高度向上是marginTop：-li.height(每个li的高度);*当滚动到最后一个li时候那么最外层的容器应该滚动到0了那么我就把第一个li加到ul里面去这样就实现了循环滚动*而不会滚动到最后一个就停止下来了*/functionautoScroll(obj){$(obj).find(".list").animate({marginTop:"-25px"},500,function(){$(this).css({marginTop:"0px"}).find("li:first").appendTo(this);})}$(function(){setInterval('autoScroll(".scroll")',3000)})

下面我上传个附件 不明白的地方可以看看！

附件：http://down.51cto.com/data/2359306