Time for action — creating simple tabs

  1. We'll get started with our basic HTML file and associated folders, like we created in Chapter 1, Designer, Meet jQuery. Inside the<body> tag, we'll start by setting up our simple example that will work even for users with JavaScript disabled: we'll put a list of anchor links to different areas of the page at the top, then wrap each of our content sections in a div with an id as follows:
    <h1>Simple Tabs Product</h1> <p>You should buy this, it's great!</p> <ul> <li><a href="#description">Description</a></li> <li><a href="#photos">Photos</a></li> <li><a href="#details">Details</a></li> <li><a href="#reviews">Customer Reviews</a></li> <li><a href="#related">Related Items</a></li> </ul> <div id="description"> <h2>Overview</h2> ...

Get jQuery for Designers Beginner's Guide now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.

Start your free trial