A Simple and Smooth jQuery Newsticker Plugin | eocjsNewsticker

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>
  // options here

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

  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.


  // animation speed
  speed: 20,

  // time to wait before starting
  timeout: 1,

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

  // or 'ajax'
  type: 'static'

5. Customize the AJAX mode.


  // 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

Official Website(eyeofchaos): Click Here

This superior jQuery/javascript plugin is developed by eyeofchaos. For extra Advanced Usages, please go to the official website.

Related Posts


Responsive Drag and Drop File Uploader/Download Plugin | 5x5_jq_uploader

5x5_jq_uploader plugin can be used to instantly create a drop file area and file queue with a little bit of preparation. Bootstrap is used for responsive planning…


Stylesheet For Implementing Dark Mode with Bootstrap

Bootstrap Dark Mode provides a style sheet and two texts that allow you to implement Dark Mode on your website. Initially loaded based on user preferences, can…


Multi-purpose Navigation Menu for Javascript Library | jQuery Corenav

coreNavigation is a multipurpose navigation menu for a jquery based javascript library, comes with more style, and is easy to integrate. 11 Default Menu 2 Responsive Navigation…


Simple Multi-Select Dropdown Pure Vanilla Javascript | multiSelect.js

MultiSelect.js is a simple, clean, and progressive JavaScript library designed for easy integration with any type of project or system. The design was heavily influenced by the…


Confetti Falling Animation Effect In JavaScript | party.js

Party.js is a JavaScript library to brighten user site experience with visual effects! Celebrate success with dom confetti! The library is written in TypeScript and compiled into…


How To Create A Popup in HTML with CSS

How to create popup in html with css – Popup without JavaScript is an elegant pop-up panel component with an animated scale, written in CSS. Have you…