 |
| Smooth Horizontal Text Scroller With jQuery |
An easy yet configurable jQuery news ticker plugin which smoothly, horizontally, and infinitely scrolls through text blocks at a given speed.
Supports static text and JSON/JSONP data source (via AJAX). Perfect for breaking news, stock quotes, informational messages, etc.
How to use it:
1. To get started, include jQuery library and the eocjsNewsticker plugin's files on the HTML page.
<script src="/path/to/cdn/jquery.min.js"></script> <script src="eocjs-newsticker.js"></script> <link rel="stylesheet" href="eocjs-newsticker.css" />
2. Create a static news ticker that loads content from the text block within the document.
<div id="example">This Is A Static News Ticker</div>
$("#example").eocjsNewsticker({
// options here
});
3. Create a dynamic news ticker that loads content from an exteral JSON file via AJAX.
<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. Config the news ticker with the following options.
$("#example").eocjsNewsticker({
// animation speed
speed: 20,
// time to wait before starting
timeout: 1,
// divider between news
divider: '+++',
// or 'ajax'
type: 'static'
});
5. Customzie the AJAX mode.
$("#example").eocjsNewsticker({
// data source
source: '',
// or 'jsonp'
dataType: 'json',
// used for jsonp
callback: 'callback',
// polling interval of the ajax source (seconds)
interval: 120,
// direction (ltr or rtl)
'direction': 'ltr'
});
File Info
- File Name :
- eocjsNewsticker-main.zip
- Size :
- 5.88KB
- Site Download :
- Github.com
- Official Website:
- Go to website
- License:
- MIT