Use jQuery and ASP.NET to Build a News Ticker
Many websites display a news ticker 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. For example, on Cisco's website there is a news ticker that shows the company's latest news
items. Each news item is a one sentence link, such as "Desktop Virtualization Gathers Steam," or "Cisco Reports First Quarter Earnings." Clicking a headline
whisks you to a page that shows the full story. Cisco's news ticker shows one headline at a time; every few seconds the currently displayed headline fades out and the
next one appears. In total, Cisco has five different headlines - the ticker displays each of the five and then starts back from the beginning.
This article is the first in a series that explores how to create your own news ticker widget using jQuery and ASP.NET. jQuery is a
free, popular, open-source JavaScript library that simplifies many common client-side tasks, like event handling, DOM manipulation, and Ajax. This article kicks off
the series and shows how to build a fairly simple news ticker whose contents can be specified statically in HTML markup or created dynamically from server-side code.
Future installments will explore adding bells and whistles, such as: stopping the news ticker rotation when the mouse is hovered over it; adding controls to start,
stop and pause the headlines; loading new headlines dynamically using Ajax; and packaging the JavaScript used by the ticker into a
jQuery plugin.
Read on to learn more!
Read More >
