在很多场景中，我们需要使用到中奖信息播报，或者一些文本信息循环滚动播报，在结合实际的开发中，然后也百度查询了相关的知识点，现在送上jQuery实现文本滚动。
1：html代码文件
相关使用说明也在页面相关位置标注啦
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<title>文本滚动</title>
<link rel="stylesheet" type="text/css" href="css/style.css" rel="external nofollow" >
<script src="jquery-1.9.1.min.js"></script>
<script src="jquery.scroll.js"></script>
<script src="txtscroll.js"></script>
<style>
.new_trade .new_trade_body .yl{margin-top:4px}
.fix_tradebottom{clear:both;background:#222; position:fixed;width:100%;left:0;z-index:12;bottom:0}
.trade_win{height:26px;line-height:26px;width:54%;text-align:center;color:#646464;font-size:12px;border-top: 1px solid #c8c8c8;border-bottom: 1px solid #c8c8c8;background:#f3f3f3;}
#trade_win{height:26px;line-height:26px;width:100%;overflow:hidden;}
.trade_win ul{height:26px;line-height:26px}
.trade_win li{width:100%;display:block;}
.trade_win li span{ no-repeat;background-position: 0px 3px;background-size:13px 10px; padding-left:18px;}
</style>
</head>
<h2 style="margin-left: 426px;">纵向滚动</h2>
<div class="trade_win" style="margin-left: 426px;">
<div id="trade_win">
<ul>
<li><span>恭喜道1中奖 825.00元</span></li>
<li><span>恭喜道2中奖 825.00元</span></li>
<li><span>恭喜道3中奖 825.00元</span></li>
<li><span>恭喜道4中奖 825.00元</span></li>
<li><span>恭喜道5中奖 825.00元</span></li>
<li><span>恭喜道6中奖 825.00元</span></li>
<li><span>恭喜道7中奖 825.00元</span></li>
</ul>
</div>
</div>
<script>
$(document).ready(function(){
//speed:滚动的速度 数值越大速度越慢。 timer:数据停留时间 数值越大停留时间越久
$('#trade_win').Scroll({ line: 1, speed: 1000, timer: 1500 });
})
</script>
<div class="demo"><h2>横向滚动</h2>
<div class="demolist">
<ul class="ul">
<li>
<h4>示例1 - 无滚动效果</h4>
<div class="demo-cont">
<div class="txt-scroll txt-scroll-default">
