jQuery easy ticker is a news ticker like plugin, which scrolls the list infinitely. It is highly customizable, flexible with lot of features and works in all browsers.


  • Two directions available (Up and down).
  • Can be targeted on any template.
  • Flexible API for extending to various applications.
  • Supports ‘easing’ functions.
  • Mouse pause feature available.
  • The speed of the transition can be changed.
  • Controls can be added in order to Play/pause or move the list Up and down.
  • Cross browser support.
  • Highly customizable.
  • Light-weight (4 Kb – Full source / 2.7 Kb – Minified source).

WordPress plugin

This plugin is used in Super RSS Reader – WordPress plugin to ticker the RSS feeds present in the sidebar. You can try this WordPress plugin in your WordPress site.


Click the button below to view the example and demonstrations of jQuery easy ticker plugin.


jQuery easy ticker source is hosted in Github. Use the link below to download the entire package.


Basic Usage

  • Include jquery.js and jquery.easy-ticker.js files to the page
  • Attach the plugin to the elements needed with the easyTicker function.



<div class="ticker1">
	<div class="innerWrap">
		<div class="list"> List 1 </div>
		<div class="list"> List 2 </div>
		<div class="list"> List 3 </div>
		<div class="list"> List 4 </div>

<div class="ticker2">
		<li> List 1 </li>
		<li> List 2 </li>
		<li> List 3 </li>
		<li> List 4 </li>

jQuery code

$('.ticker1, .ticker2').easyTicker({
	direction: 'up',
	easing: 'swing',
	speed: 'slow',
	interval: 2000,
	height: 'auto',
	visible: 0,
	mousePause: 1,
	controls: {
		up: '',
		down: '',
		toggle: '',
		playText: 'Play',
		stopText: 'Stop'

Available properties


This property determines the direction of movement of the list. Values: up & down. Default: up


The easing property allows to add some easing effects to the transition using the easing function available from the Easing plugin. Just download and include the plugin in the page and give the required easing function name as value. Default: ‘swing’. Check out the demo to get an example.


This property determines the speed of transition. Values: slow, medium, fast or any value in milliseconds.


The time for the next transition to take place. Values: time in milliseconds. Default: 2000 (2 seconds delay for next transition)


The height of the element can be controlled by this property. If the height is set to auto, the height is automatically determined to fit the list. Exact values like 200px or 300px can also be set. Default: auto.


The number of visible elements of the list can be set to this property. Values: 0 (display all) or any specific count like 1, 2, 3 etc. Default: 0


The timer can be stopped when the mouse rolls over the element. Values: 0 – Disable mouse pause & 1 – Enable mouse pause. Default: 1


The controls property is used to assign the elements which control the transition. The value is an object with the following properties.

  • up – The element to do a “Up” transition. Value: any element selector
  • down – The element to do a “Down” transition. Value: any element selector
  • toggle – The element to “Play/Pause” the transition. Value: any element selector

    Note: A class named et-run is added to the “toggle” element when the transition is in on-state

  • playText – The text of the toggle button, when the ticker is running.
  • stopText – The text of the toggle button, when the ticker is stopped.

Add your comment 42 Comments so far