Accessible Tabs Using jQuery

A good solution for a page that has a lot of information: divide it into panels and use Tabs to show the content. The Tabs degrade gracefully when Javascript is switched off. This is almost the complete solution: the last tab viewed persists using a cookie and accessibility is provided using Accesskeys 'P' and 'N' to navigate through the tabs. The tabs can have any design as they are based on standard menu principles.

Introduction

Rather than producing page after page of links, it is possible to create a series of Tabs using jQuery and make the content change in the main browser area only.

Anything that can be placed on a standard Web page can be displayed within the Tabs.

If the page is refreshed, the current Tab will remain active.

Gallery

Sheffield Park

Sheffield Park in Spring

Palmse Manor

Palmse Manor Guest House

Scotney Castle

Scotney Castle Gardens

Winkworth Arboretum

Winkworth Arboretum in Spring

Palmse Manor

Palmse Manor

Durdle Door, Dorset

Durdle Door, Dorset

Abja Paluoja

Abja Paluoja

Gibbet Hill

Gibbet Hill

Stonehenge

Stonehenge

Flash Movie

Flash is the standard way to provide a high quality, rotating gallery of images.

Slide shows can be created as banners, advertisements, animations or individual image shows.

Acknowledgement

Althought now part of the jQuery UI, much credit must go to Klaus Hartl for the development of this excellent piece of work.