IOTBS Manual
Step 1: Choose a mode and interface
The first step is simply to make two decisions:
- select the interface you want
- choose an implementation mode
The choices you make here affect every other
step of the setup process, which is why
we have to do this first.
If it all seems a little confusing right now, the simplest
configuration is an Original
interface in "standard" mode
(which was IOTBS v1.0);
if you start with that, you'll always be able to change it later.
Interfaces
The script is available in a choice of three interfaces, each of which generates the switching controls as a different kind of HTML:
Original
- Generates forms and selectors
The Director's Cut
- Generates definition-lists and links
The Radio Edit
- Generates forms, legends and radios
None of them are intrinsically "better" than any other - it's up to you
to decide which has the best semantics, behaviour or appearance for your situation.
In our opinion, the form-based interfaces are the most
semantically-correct, but
The Director's Cut
offers the richest styling possibilities.
Implementation modes
The script can then be used in one of three implementation modes, which control how the basic switching mechanism works:
- Standard body-class switcher ("standard mode")
-
This is the classic IOTBS
technique of using multiple
classnames on the<body>element, for CSS rules kept in a single stylesheet (or any other convenient arrangement). - Load stylesheets on-demand ("load mode")
-
With this configuration, the switching mechanism works off one
<link>element per group, and loads new stylesheets into those, as required. This allows for situations where each option uses a large number of rules - more than you would want to load all at once. - Load stylesheets and integrate with native switching ("integrate mode")
-
This configuration is an extension of load mode,
and allows you to nominate one
of your switching groups to integrate with native (browser-based)
stylesheet switching. For that particular group the stylesheets no longer
load on-demand, since they're all already included on the the page;
they're implemented with traditional
"alternate stylesheet"semantics, and switched by toggling theirdisabledproperties.
Having decided which interface and mode you want to use, we can now start looking at practical details.
![[php]](/images/php.gif "Uses PHP")