Pausing and Resuming the jQuery / ASP.NET News Ticker

Posted by: 4GuysFromRolla.com Headlines, on 02 Feb 2011 | View original | Bookmarked: 0 time(s)

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. In December 2010 I wrote an article titled 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 ticker's content is defined as an unordered list (<ul>) where each list item (<li>) represents a news headline. Once the ticker's content is defined, having it cycle through the head lines is as simple as calling the JavaScript function startTicker(id, numberToShow, duration), which begins cycling the headlines in the unordered list with the specified id, showing numberToShow headlines at a time and cycling to the next headline every duration 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!
Read More >

Category: ASP.NET | Other Posts: View all posts by this blogger | Report as irrelevant | View bloggers stats | Views: 1647 | Hits: 84

Similar Posts

  • SQL SERVER PAGELATCH_DT, PAGELATCH_EX, PAGELATCH_KP, PAGELATCH_SH, PAGELATCH_UP Wait Type Day 12 of 28 more
  • SQL SERVER PAGEIOLATCH_DT, PAGEIOLATCH_EX, PAGEIOLATCH_KP, PAGEIOLATCH_SH, PAGEIOLATCH_UP Wait Type Day 9 of 28 more
  • Oredev Wrap-Up more
  • November's Toolbox Column Now Online more
  • Introducing Versatile DataSources more
  • Get Ready for Teleriks Custom-built Extensions for ASP.NET MVC more
  • Samedi.NET special Silverlight event in Montreal more
  • Visual Studio 2010 Extension Manager more
  • TIP: How To Generate a Fully Qualified URL in ASP.NET (E.g., http://www.yourserver.com/folder/file.aspx) more
  • Rich Tooltips With jQuery more

News Categories

.NET | Agile | Ajax | Architecture | ASP.NET | BizTalk | C# | Certification | Data | DataGrid | DataSet | Debugger | DotNetNuke | Events | GridView | IIS | Indigo | JavaScript | Mobile | Mono | Patterns and Practices | Performance | Podcast | Refactor | Regex | Security | Sharepoint | Silverlight | Smart Client Applications | Software | SQL | VB.NET | Visual Studio | W3 | WCF | WinFx | WPF | WSE | XAML | XLinq | XML | XSD