jquery滚动组件(vticker.js)实现页面动态数据的滚动效果

　　<script language="javascript" src="lirms/Test/jquery-1.4.2.js"></script>

　　<script language="javascript" src="lirms/Test/vticker.js"></script>

　　<script type="text/javascript">

　　$(document).ready(function() {

　　$(".roll").each(function() {

　　$(this).vTicker({

　　showItems : 18, //显示滚动行数

　　pause : 3000, //滚动间歇

　　speed : 500, //滚动速度

　　animation : "fade",

　　mousePause : false,

　　direction : "up", //滚动方向

　　});

　　});

　　});

　　</script>

　　<div class="conn">

　　<table>

　　<tr>

　　<th style="width:50px;">序号</th>

　　<th style="width:150px;">名称</th>

　　<th style="width:80px;">季度完成量</th>

　　<th style="width:50px;">昨日</th>

　　<th style="width:70px;">完成进度</th>

　　<th style="width:80px;">基本指标</th>

　　<th style="width:70px;">挑战指标</th>

　　</tr>

　　<tr>

　　<td colspan="7">

　　<div class="roll">

　　<ul>

　　<c:forEach items="${statislist}" var="s" varStatus="i">

　　<c:set var="cs" value=""></c:set>

　　<c:set var="index" value=""></c:set>

　　<c:if test="${i.index < 9 }">

　　<c:set var="index" value="0"></c:set>

　　</c:if>

　　<c:if test="${i.index % 2==0}">

　　<c:set var="cs" value="background:#ebf6fd;"></c:set>

　　</c:if>

　　<li style="height:30px;width:550px;line-height:30px;${cs}">

　　<div style="width:50px;text-align:center;float:left;">${index} ${i.count}</div>

　　<div style="width:150px;text-align:center;float:left;">${s.name}</div>

　　<div style="width:80px;text-align:center;float:left;">${s.number}</div>

　　<div style="width:50px;text-align:center;float:left;">${s.zuori}</div>

　　<div style="width:70px;text-align:center;float:left;">${s.wcjb}</div>

　　<div style="width:80px;text-align:center;float:left;">${s.jbzb}</div>

　　<div style="width:70px;text-align:center;float:left;">${s.tzzb}</div>

　　</li>

　　</c:forEach>

　　</ul>

　　</div>

　　</td>

　　</tr>

　　</table>

　　</div>