An Accessible Modal Box
March 30, 2018 12:00 AM
Attached to this post is an example of how to add an accessible modal box to a Lectora title. If you add this object at the title level, you can simply add a modal box (or several) on any page within the title. The object consists of a group of HTML Extension objects (undefined
Bill
Discussion (2)
I've updated the modal box files. These files (attached here as a group) can be added to the Title level, so that a modal box can be added to any page in a title. This is an alternative to the lame "lightbox" provided in Lectora. Of course, if you want to produce accessible content, you have the web accessibility option checked because the "lightboxes" are not accessible. The Lectora developer have chosen not to make the "lightboxes" accessible, but fall back to a native dialog box from decades past. I don't call that a commitment to accessibility.
undefined
showMB("A list|Here is a list of items:|Item 1~Item 2~Item 3");
undefined
showMB("A list|Here is a list of items:|Item 1+Item 2+Item 3");
undefined
Bill
Here is a variation on the theme of an accessible modal box. This one is a tabbed modal box, so when you press the tabs within the modal box, the content changes.
If you add the attached group to the title level, you can add a tabbed modal box to any page in the title. You use the showTMB(text) to display the modal box. The text parameter is the content of the box.
For example,
showTMB("Modal Box Header|Tab 1=This is the content of tab 1.|Tab 2=This is the content of tab 2.|Tab 3=This is the content of tab 3.");
You can add additional paragraphs and/or lists to a tab by placing the text in additional vertical bar segments immediately after the segment defining the tab in which they should appear (see the previous post for more details).
undefined
Bill
Discussions have been disabled for this post