向上滚动特效

要实现图中圈起来的向上滚动特效,大家可以参考下面的代码

<!--滚动开始-->
<style type="text/css">
.auto-roll{
  height:35px;
  overflow:hidden;
  background:#fff;
  margin-top:10px;
}
.auto-roll li{
  padding-left:8px;
  line-height:35px;
}
.auto-roll li i:nth-child(1){
  color:orange;
  margin-right:7px;
}
.auto-roll li a{
  color:orange;
}
</style>
  <div class="auto-roll">
    <ul class="qun_wapindex_r001">
      {qb:tag name="qun_wapindex_r001" type="qun" order="id" by="desc" rows="5" js="qun_wapindex_r001"}
      <li><i class="fa fa-volume-up"></i>恭喜<a href="{$rs.url}">{$rs.title}</a>入驻成功</li>
      {/qb:tag}
    </ul>
  </div>
<script type="text/javascript">
    function autoScroll(obj){
    $(obj).find("ul").animate({
      marginTop : "-35px"
    },1000,function(){
      $(this).css({marginTop : "0px"}).find("li:first").appendTo(this);
    })
  }
  $(function(){
    var scroll=setInterval('autoScroll(".auto-roll")',2500);
         $(".auto-roll").hover(function(){
            console.log("aaa");
            clearInterval(scroll);
         },function(){
            scroll=setInterval('autoScroll(".auto-roll")',2500);
         });
  });
</script>
<!--滚动结束-->

上面是标签调用圈子的

{qb:tag name="qun_wapindex_r001" type="qun" order="id" by="desc" rows="5" js="qun_wapindex_r001"}

你把 type="qun" 改成 type="bbs" 就是调用论坛的内容