二款jquery 上下滚动效果

二款jquery 上下滚动效果
本文章收藏了二款jquery 上下滚动效果代码，利用jquery做的上向滚动效果比起js来的说要简单实用，并且效果要漂亮一些。

<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns="http://www.zzzyk.com/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>jquery 上下滚动效果</title>
<script type="text/网页特效" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript">
$ (document).ready(function (){
      var roll=$("#rolllist li");
      var num=roll.length;
      var i=0;
      setinterval(function(){
       roll.eq(i).fadeout("slow");
       roll.eq(i+1).fadein("slow");
       i++;
      if(i>=num)
      {
       i=0;
       roll.eq(i).fadein("slow");
      }
      },1000);
      });
</script>
<style>
ul {
height:26px;
overflow:hidden;
background:#ccc;
}
li {
height:25px;
font-size:13px;

margin-top:1px;
line-height:25px;
list-style:none;
}
</style>
</head>
<body>
<ul id="rolllist">
<li><a href="#">1sdawda</a></li>
<li><a href="#">2asdawaghsa好iadiau啊大时代阿斯顿啊啊沙发</a></li>
<li><a href="#">3啊收到皮是公司两个啊力进书法家</a></li>
<li><a href="#">4啊沙发空间是个发觉法律思考</a></li>
<li><a href="#">5asdawda</a></li>
<li><a href="#">6asdawaghsa好iadiau啊大时代阿斯顿啊啊沙发</a></li>
<li><a href="#">7啊收到皮是公司两个啊力进书法家</a></li>
<li><a href="#">8啊沙发空间是个发觉法律思考</a></li>
<li><a href="#">9asdawda</a></li>
<li><a href="#">10asdawaghsa好iadiau啊大时代阿斯顿啊啊沙发</a></li>
<li><a href="#">11啊收到皮是公司两个啊力进书法家</a></li>
<li><a href="#">12啊沙发空间是个发觉法律思考</a></li>
</ul>
</body>
</html>

滚动代码二

script type="text/javascript">
function autoscroll(obj) {
$(obj).find("ul:first").animate({
margintop: "-190px"
}, 500, function() {
$(this).css教程({ margintop: "0px" }).find("li:first").appendto(this);
}); <script language="javascript" src="http://zzzyk.com/ads728x15.js" type="text/javascript"></script>
}
$(document).ready(function() {
setinterval('autoscroll("#scrolldiv")', 3000)
});
</script>
<style type="text/css">
ul, li
{
margin: 0;
padding: 0;
}
#scrolldiv
{
height: 190px;
line-height: 190px;
overflow: hidden;
}
#scrolldiv li
{
height: 190px;
}
</style>
<div id="scrolldiv" class="banner_little">
<ul>
<li>第一行</li>
<li>第二行</li>
</ul>
</div>

补充：网页制作,jquery