Creating a news ticker

This recipe will show you how to create a simple news ticker with a stop/pause functionality. A news ticker is a great way to display a lot of information such as tweets, quotes, or general news items in a small space.

Getting ready

Once again, you are going to need to create three files. Create recipe-2.html, recipe-2.css, and recipe-2.js in the same directory as the latest version of jQuery.

How to do it…

Carry out the following step-by-step instructions to create an animated news ticker:

  1. Add the following HTML code to recipe-2.html to create a simple web page and content for our ticker:
    <!DOCTYPE html> <html> <head> <title>Chapter 6 :: Recipe 2</title> <link href="recipe-2.css" rel="stylesheet" type="text/css" /> <script src="jquery.min.js"></script> ...

Get jQuery 2.0 Development Cookbook now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial