Below are 3 forms, each containing a collection of DOM elements that we want the user to be able to tab between. However, we don't want to rely on browser tabbing logic, we want to control the behavior. This way once the user enters a form, they can tab through all fields (forward and backwards), and restart at the first field after completing the last. In addition, some operating systems/browsers have undesired tabbing variations.
The first form, contains all 10 types of input fields, 1 select, 1 textarea, and 1 anchor. It shows how using this widget you can tab through all these fields. The second form, just has 3 text input fields. And the third form has a mix of text input fields, where some are hidden or displayed as 'none', illustrating how this widget ignores invisible fields. The third form also listens on the CE_AFTER_TAB event and changes the the background color of the form as you tab through it.