Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Migrated to Confluence 5.3
Section
Column
width60%

This page will walk you through an example of adding the Infusion Keyboard Accessibility Plugin to your application.

This tutorial is based on the code that is used for our Keyboard Accessibility Demo . It assumes that:

  • you are already familiar with HTML, Javascript and CSS
  • you are basically familiar with what the Keyboard Accessibility Plugin is and does
  • now you just want to know how to use it.

For technical API documentation, see Keyboard Accessibility Plugin API.

Tutorial: How to Use the Keyboard Accessibility Plugin

Scenario

You're creating a photo-album application that will let your friends rate the photographs you've taken. You've even found a nice little five-star rating widget to use. You want to make sure your application is accessible using the keyboard as well as the mouse.

There are three basic steps to adding Keyboard Accessibility to your application:

  • Setup: Download and install the Fluid Infusion library
  • Step 1: Prepare your markup
  • Step 2: Write the script
  • Step 3: Add the script to your HTML

The rest of this tutorial will explain each of these steps in detail.

Column
solid
Panel
borderStyle
borderColor#566b30
bgColor#fff
titleBGColor#D3E3C4
borderStylesolid
titleOn This Page
Table of Contents
toc
maxLevel
maxLevel
5
minLevel25
Panel
borderColor#321137
bgColor#fff
titleBGColor#c1b7c3
borderStylesolid
titleSee AlsoborderStylesolid
Panel
borderColor#321137
bgColor#fff
titleBGColor#cccccc
borderStylesolid
titleStill need help?borderStylesolid

Join the fluid-talk mailing list and ask your questions there.

...