Pausing and Resuming the jQuery / ASP.NET News Ticker

EDN Admin

Well-known member
Joined
Aug 7, 2010
Messages
12,794
Location
In the Machine
Many websites display a <i>news ticker</i> of one sort or another. A news ticker is a user interface element that displays a subset of a list of items, cycling through
them one at a time after a set interval. In December 2010 I wrote an article titled http://www.4guysfromrolla.com/articles/120110-1.aspx Use jQuery and ASP.NET
to Build a News Ticker that explored how to create your own news ticker widget using jQuery and ASP.NET.
The news tickers content is defined as an unordered list (
Code:
) where each list item (
Code:
) represents a news headline.
Once the tickers content is defined, having it cycle through the head lines is as simple as calling the JavaScript function
Code:
startTicker(<i>id</i>, <i>numberToShow</i>, <i>duration</i>)
, which begins cycling the headlines in the unordered list with the specified <i>id</i>,
showing <i>numberToShow</i> headlines at a time and cycling to the next headline every <i>duration</i> number of milliseconds.

This installment shows how to enhance the news ticker to enable pausing and resuming. With these enhancements, the ticker can be configured to automatically
pause rotating its headlines when the user mouses over it, and to resume rotating them once the user mouses out. Similarly, with a bit of additional markup and script
you can add pause and play buttons to a ticker, allowing a user to start and stop the ticker by clicking an image or button.
Read on to learn more!

http://www.4guysfromrolla.com/articles/020211-1.aspx" class="readmore Read More >

View the full article
 
Back
Top