jquery（eocjs-newsticker）文字水平循环滚动动画插件

演示  website 下载

eocjs-newsticker是一款简单可配置的jQuery插件，可以实现文本水平循环滚动，设定文本滚动速度。适用于新闻突发、股票报价、消息等循环播报。支持静态文本和JSON / JSONP数据源/AJAX异步获取数据。

1. 在HTML页面中加载jQuery库和eocjsNewsticker插件文件。

<script src="jquery.min.js"></script>
<script src="eocjs-newsticker.js"></script>
<link rel="stylesheet" href="eocjs-newsticker.css" />

2. 静态调用方法：

<div id="example">This Is A Static News Ticker</div>
$("#example").eocjsNewsticker({
  // options here
});

3. 通过JSON文件加载内容

<div id="example"></div>
$("#example").eocjsNewsticker({
  type: 'ajax',
  source: 'data.json'
});
// data.json
{
  "1": "Breaking News 1", 
  "2": "Breaking News 2", 
  "3": "Breaking News 3", 
  "4": "Breaking News 4", 
  "5": "Breaking News 5"
}

4. 配置选项

$("#example").eocjsNewsticker({
  // animation speed
  speed: 20,
  // time to wait before starting
  timeout: 1,
  // divider between news
  divider: '+++',
  // or 'ajax'
  type: 'static'
});

5. AJAX模式

$("#example").eocjsNewsticker({
  // data source
  source: '',
  // or 'jsonp'
  dataType: 'json',
  // used for jsonp
  callback: 'callback', 
  // polling interval of the ajax source (seconds)
  interval: 120 
});

会员登陆后即可下载资源文件。更多好用网站特效插件，请关注帝国模板之家。