eocjsNewsticker is a new, Responsive Sticker. Adjusts size and content for any device and window size. It can be configured to read its contents from an HTML document that invokes or from an AJAX source (JSON or JSONP).

horizontal news scroller jquery examples, news ticker jquery, vertical scrolling news ticker html, breaking news ticker html code, vertical scrolling news ticker

How to make use of it:

1. To get started, include the jQuery library and the eocjsNewsticker plugin’s files on the HTML web 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 information ticker that loads content from the text block within the doc.

<div id="example">This Is A Static News Ticker</div>

$("#example").eocjsNewsticker({
  // options here
});

3. Create a dynamic information ticker that loads content from an external JSON file by way of AJAX.

$("#example").eocjsNewsticker({
  type: 'ajax',
  source: 'data.json'
});

// data.json
{
  "1": "The quick brown fox jumps over the lazy dog", 
  "2": "The quick brown fox jumps over the lazy dog", 
  "3": "The quick brown fox jumps over the lazy dog", 
  "4": "The quick brown fox jumps over the lazy dog", 
  "5": "The quick brown fox jumps over the lazy dog"
}

4. Config the information ticker with the next choices.

$("#example").eocjsNewsticker({

  // animation speed
  speed: 20,

  // time to wait before starting
  timeout: 1,

  // divider between news
  divider: '+++',

  // or 'ajax'
  type: 'static'
  
});

5. Customize 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 

});

Smooth Horizontal Text Scroller, HTML news ticker horizontal, eocjsNewsticker Plugin/Github, jquery ticker example, breaking news ticker website

See Demo And Download