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. Here's the entire article, Use jQuery and ASP.NET to Build a News Ticker.

Related Articles



About the Author

Scott Mitchell

Scott Mitchell is the Editor, founder, and primary contributor to 4GuysFromRolla.com. In addition to founding 4GuysFromRolla.com, Scott also created ASPFAQs.com and ASPMessageboard.com. He works as a freelance writer, trainer, and consultant and resides in California.

Comments

  • There are no comments yet. Be the first to comment!

Leave a Comment
  • Your email address will not be published. All fields are required.

Top White Papers and Webcasts

  • On-demand Event Event Date: September 10, 2014 Modern mobile applications connect systems-of-engagement (mobile apps) with systems-of-record (traditional IT) to deliver new and innovative business value. But the lifecycle for development of mobile apps is also new and different. Emerging trends in mobile development call for faster delivery of incremental features, coupled with feedback from the users of the app "in the wild." This loop of continuous delivery and continuous feedback is how the best mobile …

  • Packaged application development teams frequently operate with limited testing environments due to time and labor constraints. By virtualizing the entire application stack, packaged application development teams can deliver business results faster, at higher quality, and with lower risk.

Most Popular Programming Stories

More for Developers

Latest Developer Headlines

RSS Feeds