A jQuery plug-in that adds scrolling
vertical tickers to your site
Methods
init
Initializes and starts a vTicker for a specified selector/element
init(JSON object {} options)
options.speed 700
Sets the transition speed when animated
options.pause 4000
Delay before scrolling to next item
options.showItems 1
The number of items to display in the ticker
options.mousePause true
When mouse is over ticker should it pause the ticker
options.height 0
Use a fixed height for the ticker. Normally the height is automatically calculated based on the value of showItems
options.animate true
When true the ticker transitions will be animated
options.margin 0
Applies margin to each LI element in the ticker
options.padding 0
Applies padding to each LI element in the ticker
options.startPaused false
Starts the ticker in paused state
options.autoAppend true
Automatically appends items to the list, so that the list will loop
init Example
$('#example').vTicker('init', {speed: 400,
pause: 1000,
showItems: 2,
padding:4});init Result
- Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
- Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
- Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore
stop
Stops an existing vTicker from updating/animating. To restart call init again.
stop Example
$('#example').vTicker('stop');pause
Pause or resume the ticker
pause(boolean paused)
paused
When set to true the ticker is paused. When set to false the ticker is resumed.
pause Example
$('#example').vTicker('pause', true);
$('#example').vTicker('pause', false);pause Test
- Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
- Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
- Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore
next
Advances to the next ticker item
next(JSON object {} options)
options.animate (boolean) false
When true, the next item is animated into view. If false, the next item is shown without animation. If this parameter is not specified then no animation is used by default.
next Example
$('#example').vTicker('next', {animate:true});
$('#example').vTicker('next', {animate:false});next Test
- Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
- Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
- Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore
prev
Returns to the previous ticker item
prev(JSON object {} options)
options.animate (boolean) false
When true, the previous item is animated back into view. If false, the previous item is shown without animation. If this parameter is not specified then no animation is used by default.
prev Example
$('#example').vTicker('prev', {animate:true});
$('#example').vTicker('prev', {animate:false});prev Test
- Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
- Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
- Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore
remove
Stops and completely removes an existing vTicker from the document
remove Example
$('#example').vTicker('remove');