diff --git a/README.md b/README.md index d4735dc30a..24c8c4e411 100644 --- a/README.md +++ b/README.md @@ -97,12 +97,30 @@ The formal publication location for Understanding pages is currently https://www ## Editing Techniques -Techniques are in the techniques folder, and grouped by technology into sub-folders. Each technique is a standalone file, which is in HTML format with a regular structure of elements, classes, and ids. Techniques previously published for WCAG 2.0 are currently have the assigned ID of the technique as the filename, but new techniques should use a filename that is derived from a shortened version of the technique title. +Techniques are in the techniques folder, and grouped by technology into sub-folders. Each technique is a standalone file, which is in HTML format with a regular structure of elements, classes, and ids. -For example, a technique "Using the alt attribute on the img element to provide short text alternatives" might use "img-alt-short-text-alternatives.html" as the filename. +### Technique File Structure + +The [technique template](techniques/technique-template.html) shows the structure of techniques. Main sections are in top-level <section> elements with specific IDs: meta, applicability, description, examples, tests, related, resources. The description and tests sections are required; the applicability and examples sections are recommended; the related and resources sections are optional. The meta section provides context for the technique during authoring but is removed for publication. The title of the technique is in the `

` element. Elements with `class="instructions"` provide information about populating the template. They should be removed as the technique is developed but if not removed, will be ignored by the generator. **Do not copy `class="instructions"` on real content.** + +The generator used to publish techniques uses XML processing, so techniques must be well-formed XML. Techniques use HTML 5 structure so are actually [HTML Polyglot](https://www.w3.org/TR/html-polyglot/). + +### Images, Examples, Cross References for Techniques + +Techniques can include images. Place the image file in the `img` folder of the relevant technology - meaning all techniques for a technology share a common set of images. Use a relative link to load the image. Most images should be loaded with a `
` element and labeled with a `
` positioned at the bottom of the figure. Small inline images may be loaded with a `` element with suitable `alt` text. + +Techniques should include brief code examples to demonstrate how to author content that follows the technique. Code examples should be easy to read, and usually not complete content in themselves. More complete examples can be provided as [working examples](#user-content-provide-working-examples-of-techniques) (see below). Link to working examples at the bottom of each example, in a `

` element, containing a relative link to `../../working-examples/{example-name}/`. + +Cross references to other techniques may be provided where useful. Generally they should be provided in the "Related Techniques" section but can be provided elsewhere. Use a relative link to reference the technique, `{Technique ID}` if the same technology, or `../{Technology}/{Technique ID}` otherwise. If the technique is still under development and does not have a formal ID, reference the path to the development file. If the technique is under development in a different branch, use an absolute URI to the rawgit version of the technique. + +Cross references to guidelines and success criteria should use a relative URI to the *Understanding* page for that item. Cross references to other parts of the guidelines should use an absolute URI to the guidelines as published on the W3C TR page, a URI beginning with `https://www.w3.org/TR/WCAG21/#`. Note that references to guidelines or success criteria to which techniques relate are added by the generator upon publication based on information in the Understanding documents, so redundant links to those is not normally needed or advised. ### Create Techniques +[General priorities and process to work on techniques are maintained in the wiki](https://www.w3.org/WAI/GL/wiki/Wcag21-techniques). + +New techniques should use a filename that is derived from a shortened version of the technique title. Editors will assign the technique an ID and rename the file when it is accepted by the Working Group. For example, a technique "Using the alt attribute on the img element to provide short text alternatives" might use "img-alt-short-text-alternatives.html" as the filename. The editors will assign it a formal ID, and rename the file, when it is accepted by the Working Group. + Each new technique should be created in a new branch. Set-up of the branch and file is automated via the create-techniques.sh script, which can be run with bash. The command line is: ```Shell @@ -127,7 +145,13 @@ Once a technique branch and file is set up, populate the content and request rev * If you wish to reference the draft technique from an Understanding document, use the technique's rawgit URI. * After a technique is approved, the chairs will assign it an ID and update links to it in the Undestanding documents. -### Provide Working Examples of Techniques +### Formatting Techniques + +Techniques in the repository are plain HTML files with minimal formatting. For publication to the editors' draft and W3C location, techniques are formatted by an XSLT-based generator managed by Apache Ant running in Java. Most people do not need to worry about this, but relevant files are the [Ant build file](build.xml) and [XSLT files](xslt). + +The generator compiles the techniques together as a suite with formatting and navigation. It enforces certain structures, such as ordering top-level sections described above and standardizing headings. It attempts to process cross reference links to make sure the URIs work upon publication. One of the most substantial roles is to populate the Applicability section with references to the guidelines or success criteria to which the technique relates. The information for this comes from the Understanding documents. Proper use of the technique template is important to enable this functionality, and mal-formed techniques may cause the generator to fail. + +## Working Examples Examples in techniques should be brief easy-to-consume code samples of how the technique is used in content. Therefore examples should focus on the specific features the technique describes, and not include related content such as style, script, surrounding web content, etc. diff --git a/techniques/aria/ARIA1.html b/techniques/aria/ARIA1.html index 8e3676097b..e368cc6069 100644 --- a/techniques/aria/ARIA1.html +++ b/techniques/aria/ARIA1.html @@ -19,7 +19,7 @@

Using aria-describedby property to describe a Close button's action

<div id="descriptionClose">Closing this window will discard any information entered and return you back to the main page</div> -

Working example: Example 1 +

Working example: Example 1

diff --git a/techniques/aria/ARIA10.html b/techniques/aria/ARIA10.html index 06db203c01..a0e4267dc3 100644 --- a/techniques/aria/ARIA10.html +++ b/techniques/aria/ARIA10.html @@ -16,7 +16,7 @@

Providing a short description for a complex graphic

</div> <div id="star_id">4 of 5</div> -

Working example: Providing a short description for a complex graphic. +

Working example: Providing a short description for a complex graphic.

diff --git a/techniques/aria/ARIA14.html b/techniques/aria/ARIA14.html index db98bd21b6..d948ed9460 100644 --- a/techniques/aria/ARIA14.html +++ b/techniques/aria/ARIA14.html @@ -17,7 +17,7 @@

A close button (X) in a pop-up box

This is a pop-up box. <button aria-label="Close" onclick="document.getElementById('box').style.display='none';" class="close-button">X</button> </div> -

Working example: Close button example. +

Working example: Close button example.

diff --git a/techniques/aria/ARIA17.html b/techniques/aria/ARIA17.html index f378591898..ffaa7ab550 100644 --- a/techniques/aria/ARIA17.html +++ b/techniques/aria/ARIA17.html @@ -17,7 +17,7 @@

Social Security Number

<input size="2" type="text" aria-required="true" title="Next 2 digits" />- <input size="4" type="text" aria-required="true" title="Last 4 digits" /> </div> -

Working example: Multiple part field groups.

+

Working example: Multiple part field groups.

@@ -52,7 +52,7 @@

Identifying radio groups

div[role=radiogroup] {
   border: black thin solid;
 }
-

Working example: using grouping roles to identify related form controls.

+

Working example: using grouping roles to identify related form controls.

Tests

diff --git a/techniques/aria/ARIA18.html b/techniques/aria/ARIA18.html index e8849d4486..75897b4f79 100644 --- a/techniques/aria/ARIA18.html +++ b/techniques/aria/ARIA18.html @@ -30,7 +30,7 @@

Alert dialog

<button>Save and Continue</button> <button>Return to page and correct error</button> </div> -

Working example: Alert dialog.

+

Working example: Alert dialog.

Tests

diff --git a/techniques/aria/ARIA19.html b/techniques/aria/ARIA19.html index 1c111384ed..be165b9ed3 100644 --- a/techniques/aria/ARIA19.html +++ b/techniques/aria/ARIA19.html @@ -51,7 +51,7 @@

Injecting error messages into a container with role=alert already present in <input type="submit" name="button" id="button" value="Submit"> </p> </form> -

Working example: Using role=alert to identify errors.

+

Working example: Using role=alert to identify errors.

Tests

diff --git a/techniques/aria/ARIA21.html b/techniques/aria/ARIA21.html index b11041ee05..5e94464ce4 100644 --- a/techniques/aria/ARIA21.html +++ b/techniques/aria/ARIA21.html @@ -59,7 +59,7 @@

Using aria-invalid on required fields

</p> </form> </code> -

Live example.

+

Working example: Using aria-invalid on required fields.

@@ -100,7 +100,7 @@

Identifying errors in data format

background-repeat:no-repeat; background-position:right; } -

Live example.

+

Working example: Identifying errors in data format.

Tests

diff --git a/techniques/aria/ARIA9.html b/techniques/aria/ARIA9.html index f1da34b868..c5c17c3ec3 100644 --- a/techniques/aria/ARIA9.html +++ b/techniques/aria/ARIA9.html @@ -26,7 +26,7 @@

A time-out input field with concatenated label

aria-labelledby="timeout-label timeout-duration timeout-unit"> <span id="timeout-unit" tabindex="-1"> minutes</span></p> </form> -

Working example, Time-out input field with concatenated label, adapted from Easy ARIA tip #2: aria-labelledby and aria-describedby, an example put together by Marco Zehe.

+

Working example, Time-out input field with concatenated label, adapted from Easy ARIA tip #2: aria-labelledby and aria-describedby, an example put together by Marco Zehe.

@@ -52,7 +52,7 @@

A simple data table with text inputs

<td><input type="text" size="20" aria-labelledby="sp div" /></td> </tr> </table> -

Working example, Using aria-labelledby for simple table with text inputs, based on an example by Jim Thatcher.

+

Working example, Using aria-labelledby for simple table with text inputs, based on an example by Jim Thatcher.

@@ -141,7 +141,7 @@

A conference workshop booking table

</tr> </tbody> </table> -

Working example: Conference workshop booking timetable.

+

Working example: Conference workshop booking timetable.

Tests

diff --git a/techniques/client-side-script/SCR14.html b/techniques/client-side-script/SCR14.html index b03e2a945d..ff6c8def6a 100644 --- a/techniques/client-side-script/SCR14.html +++ b/techniques/client-side-script/SCR14.html @@ -53,7 +53,7 @@ Turn Alerts Off</button></p> -

Working example of this code: Demonstration of Alerts.

+

Working example of this code: Demonstration of Alerts.

Tests

diff --git a/techniques/client-side-script/SCR18.html b/techniques/client-side-script/SCR18.html index f22785c5d1..0fc37637df 100644 --- a/techniques/client-side-script/SCR18.html +++ b/techniques/client-side-script/SCR18.html @@ -62,7 +62,7 @@

Checking multiple controls when the user submits the form

</p> </form> -

This is demonstrated in the working example of checking multiple controls when the user submits the form.

+

This is demonstrated in the working example of checking multiple controls when the user submits the form.

Tests

diff --git a/techniques/client-side-script/SCR19.html b/techniques/client-side-script/SCR19.html index 5a8b3b0d6a..0d8ef83873 100644 --- a/techniques/client-side-script/SCR19.html +++ b/techniques/client-side-script/SCR19.html @@ -109,7 +109,7 @@ </body> </html> -

Here is a working example: Dynamic +

Here is a working example: Dynamic Select

diff --git a/techniques/client-side-script/SCR20.html b/techniques/client-side-script/SCR20.html index 9e623a3dff..856d1f7c56 100644 --- a/techniques/client-side-script/SCR20.html +++ b/techniques/client-side-script/SCR20.html @@ -11,59 +11,60 @@ The following table suggests keyboard event handlers to pair mouse event handlers.

- Device Handler Correspondences - - - Use... - ...with - - - - mousedown - - - keydown - - - - - mouseup - - - keyup - - - - - click - - [1] - - - keypress - - [2] - - - - - mouseover - - - focus - - - - - mouseout - - - blur - - - - -

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Device Handler Correspondences
Use......with
+ mousedown + + keydown +
+ mouseup + + keyup +
+ click + + [1] + + keypress + + [2] +
+ mouseover + + focus +
+ mouseout + + blur +
+

1 Although click is in principle a mouse event handler, most HTML and XHTML user agents also process this event when a native HTML control (e.g. a button or a link) is activated, regardless of whether it was activated with the mouse or the keyboard. In practice, therefore, it is not necessary to duplicate this event when adding handlers to natively focusable HTML elements. However, it is necessary when adding handlers to other events, such as in Example 2 below.

2 Since the keypress event handler reacts to any key, the event handler function should check first to ensure the Enter key was pressed before proceeding to handle the event. Otherwise, the event handler will run each time the user presses any key, even the tab key to leave the control, and this is usually not desirable. diff --git a/techniques/client-side-script/SCR21.html b/techniques/client-side-script/SCR21.html index 8aa3315ce7..4ae80d3877 100644 --- a/techniques/client-side-script/SCR21.html +++ b/techniques/client-side-script/SCR21.html @@ -164,7 +164,7 @@

This example is limited to client-side scripting, and should be backed up with server-side validation. The example is limited to the creation of error messages when client-side scripting is available.

-

Here is a link to a working example: Form Validation +

Here is a link to a working example: Form Validation

diff --git a/techniques/client-side-script/SCR22.html b/techniques/client-side-script/SCR22.html index 07c25bc92d..f17b821db2 100644 --- a/techniques/client-side-script/SCR22.html +++ b/techniques/client-side-script/SCR22.html @@ -36,7 +36,7 @@ ... -

Working example of this code: Using script to control blinking.

+

Working example of this code: Using script to control blinking.

Tests

diff --git a/techniques/client-side-script/SCR28.html b/techniques/client-side-script/SCR28.html index 4b1a23efbd..8b7f62710e 100644 --- a/techniques/client-side-script/SCR28.html +++ b/techniques/client-side-script/SCR28.html @@ -34,7 +34,7 @@ ... -

Working example of this code: Toggle navigation bar with a link.

+

Working example of this code: Toggle navigation bar with a link.

@@ -61,7 +61,7 @@ ... -

Working example of this code: Toggle table of contents with a button.

+

Working example of this code: Toggle table of contents with a button.

Tests

diff --git a/techniques/client-side-script/SCR29.html b/techniques/client-side-script/SCR29.html index d3397d5652..021c0d2225 100644 --- a/techniques/client-side-script/SCR29.html +++ b/techniques/client-side-script/SCR29.html @@ -63,7 +63,7 @@

Adding a JavaScript action to a div element

... -

Working example of this code: Creating Divs with Actions using JavaScript.

+

Working example of this code: Creating Divs with Actions using JavaScript.

Tests

diff --git a/techniques/client-side-script/SCR30.html b/techniques/client-side-script/SCR30.html index b1dedadbab..1c87a4e32b 100644 --- a/techniques/client-side-script/SCR30.html +++ b/techniques/client-side-script/SCR30.html @@ -76,7 +76,7 @@ ... -

Working example of this code: Providing link expansions on demand.

+

Working example of this code: Providing link expansions on demand.

Tests

diff --git a/techniques/client-side-script/SCR32.html b/techniques/client-side-script/SCR32.html index e550a24227..61855b3c80 100644 --- a/techniques/client-side-script/SCR32.html +++ b/techniques/client-side-script/SCR32.html @@ -7,6 +7,11 @@

This example validates required fields as well as fields where a specific format is required. When an error is identified, the script inserts a list of error messages into the DOM and moves focus to them.

+ +
+ +
Screenshot showing the error messages for several fields that were not filled out correctly. Error messages appear as a list of links near the top of the form.
+

HTML and Javascript code @@ -371,7 +376,7 @@ } -

Working example of this technique implemented using PHP, Javascript, CSS and XHTML: Form Validation Example.

+

Working example of this technique implemented using PHP, Javascript, CSS and XHTML: Form Validation Example.

Tests

diff --git a/techniques/client-side-script/SCR33.html b/techniques/client-side-script/SCR33.html index 43d1aa85f4..e3b79e8111 100644 --- a/techniques/client-side-script/SCR33.html +++ b/techniques/client-side-script/SCR33.html @@ -155,7 +155,7 @@ addLoadEvent(initScroller) -

A working example of this code, Example of using script to scroll content and providing a mechanism to pause it, is available.

+

A working example of this code, Example of using script to scroll content and providing a mechanism to pause it, is available.

Tests

diff --git a/techniques/client-side-script/SCR35.html b/techniques/client-side-script/SCR35.html index 2f6b8d7a78..3e810056f1 100644 --- a/techniques/client-side-script/SCR35.html +++ b/techniques/client-side-script/SCR35.html @@ -36,7 +36,7 @@ <a href="dostuff.htm" onclick="return doStuff();">do stuff</a> -

A working example of this code is available. Refer to Creating Action Links using JavaScript.

+

A working example of this code is available. Refer to Creating Action Links using JavaScript.

@@ -55,7 +55,7 @@ </form> -

A working example of this code is available. Refer to Creating Action Buttons using JavaScript.

+

A working example of this code is available. Refer to Creating Action Buttons using JavaScript.

diff --git a/techniques/client-side-script/SCR36.html b/techniques/client-side-script/SCR36.html index 0d521e443f..0a66804621 100644 --- a/techniques/client-side-script/SCR36.html +++ b/techniques/client-side-script/SCR36.html @@ -83,7 +83,7 @@

Expanding Scrolling Text in Place

... -

Working example of this code: Expanding Scrolling Text in Place.

+

Working example of this code: Expanding Scrolling Text in Place.

Tests

Tests

diff --git a/techniques/client-side-script/img/form2.jpg b/techniques/client-side-script/img/form2.jpg new file mode 100644 index 0000000000..33b47960db Binary files /dev/null and b/techniques/client-side-script/img/form2.jpg differ diff --git a/techniques/css/C15.html b/techniques/css/C15.html index 660df27f17..bed91b140f 100644 --- a/techniques/css/C15.html +++ b/techniques/css/C15.html @@ -63,7 +63,7 @@

Highlighting elements that receive focus

-

Working example of this code: Example of highlighting elements that receive focus.

+

Working example of this code: Example of highlighting elements that receive focus.

Tests

diff --git a/techniques/css/C17.html b/techniques/css/C17.html index 38bfc015ff..ec6a678c25 100644 --- a/techniques/css/C17.html +++ b/techniques/css/C17.html @@ -23,7 +23,7 @@

A Contact Form

h1 { font-size: 2em; }
             p, label, input { font-size: 1em; }
-

Working example of this code: Example of resizing input with CSS.

+

Working example of this code: Example of resizing input with CSS.

@@ -41,7 +41,7 @@

Radio button

width: 1.2em; height: 1.2em;} -

Working example of this code: Example of resizing radio buttons and checkboxes with CSS.

+

Working example of this code: Example of resizing radio buttons and checkboxes with CSS.

Tests

diff --git a/techniques/css/C27.html b/techniques/css/C27.html index 6fdd544991..60ede87234 100644 --- a/techniques/css/C27.html +++ b/techniques/css/C27.html @@ -16,7 +16,7 @@
  1. Visually examine the order of the content in the Web page as it is presented to the end user.
  2. Examine the elements in the DOM using a tool that allows you to see the DOM.
    3. -
  3. Ensure that the the order of the content in the source code sections match the visual presentation of the content in the Web page. (e.g., for an English language page the order is from top to bottom and from left to right.) "
    4. +
  4. Ensure that the order of the content in the source code sections match the visual presentation of the content in the Web page. (e.g., for an English language page the order is from top to bottom and from left to right.) "

Expected Results

diff --git a/techniques/css/C29.html b/techniques/css/C29.html index 94f39be0c5..a48f84e3d2 100644 --- a/techniques/css/C29.html +++ b/techniques/css/C29.html @@ -132,7 +132,7 @@

Using a JavaScript control to apply a different external CSS file

} -

A working example of this code, Using a JavaScript control to apply a different external CSS file, is available.

+

A working example of this code, Using a JavaScript control to apply a different external CSS file, is available.

@@ -228,7 +228,7 @@

Using a client-side JavaScript to change a CSS property

-

A working example of this code, Using a client-side JavaScript to change a CSS property, is available.

+

A working example of this code, Using a client-side JavaScript to change a CSS property, is available.

@@ -289,7 +289,7 @@

Using PHP $_GET to apply a different external CSS file

-

A working example of this code, Using PHP $_GET to apply a different external CSS file, is available.

+

A working example of this code, Using PHP $_GET to apply a different external CSS file, is available.

@@ -297,7 +297,7 @@

Using JSP to provide an alternative style sheet

The example below uses two files

    -
  • a Java Server Page (JSP) with the form and the the form processing code, and
    • +
  • a Java Server Page (JSP) with the form and the form processing code, and
  • an include file with functions used by the previous page and in other pages use the same style.

The server-side code outputs a normal link element for the stylesheet that the user chooses and link elements with "alternate stylesheet" for the other styles. The code can thus be used as a fallback for the client-side code in the second example.

@@ -495,8 +495,8 @@

Using JSP to provide an alternative style sheet

- - Using cookies +
+

Using cookies

A user's selection can be made persistent across pages, and from one visit to another, by storing information on the user's computer via a cookie. This functionality requires cookies to be supported by and allowed on the user's computer. Cookies can be created, read, modified and erased by using client-side scripts, such as Javascript, or by server-side scripts, such as CGI scripts. Reliance on client-side technologies will require the support and availability of the technology on the user's computer in addition to supporting and allowing cookies.

Information on creating and using cookies can be found on the web. Here are some suggestions:

    @@ -515,9 +515,9 @@

    Using JSP to provide an alternative style sheet

It is recommended that authors test for cookie support and provide an extra control if cookies are not supported. This extra control should include information about the persistence of the selection, such as "Apply selection to all pages". The message or page presented to the user in response to selecting the extra control provides information about the cookie requirement and their options for solving it. In the event that the user is unable to turn cookie support on, include a statement about what this will mean for them if they choose to continue to browse the site and provide information about how they can adjust their user agent to achieve similar results.

For example, "Your browser is not configured to accept cookies. On this site, cookies are required in order to apply your selected changes across all of the pages of the site. To find out how to enable cookies on your computer, visit How to Enable Cookies. Note that this may require administrative rights for the computer you are using. Without cookie support, your settings will not persist to include other pages on this site. We are endeavoring to provide this functionality without relying on your computer's capability. In the meantime, you will be able to select the change for each page that you visit."

- - - Progressive Enhancement and Unobtrusive Javascript +
+
+

Progressive Enhancement and Unobtrusive Javascript

Current best practice for implementing JavaScript in an HTML or XHTML page is to use it in a way that separates the behavior of content from its structure and presentation. The terms 'Progressive Enhancement' and 'Unobtrusive JavaScript' are often used to describe scripts that enhance or improve the functionality of a page, yet transform gracefully so that content continues to function even when JavaScript is not supported.

Here are some suggested starting points for more information:

- +
\ No newline at end of file diff --git a/techniques/failures/F1.html b/techniques/failures/F1.html index 292948bc33..c1aeb0b721 100644 --- a/techniques/failures/F1.html +++ b/techniques/failures/F1.html @@ -106,12 +106,12 @@

A better solution for this content would be to use more meaningful elements, such as a table or a definition list.

diff --git a/techniques/failures/F61.html b/techniques/failures/F61.html index f7e0c929a1..27216a6d3e 100644 --- a/techniques/failures/F61.html +++ b/techniques/failures/F61.html @@ -3,7 +3,7 @@ automatic update that the user cannot disable from within the content

ID: F61

Technology: failures

Type: Failure

When to Use

General

Description

-

This document describes a failure that occurs when the content in the main viewport viewport is automatically updated, and there there is no option for a user to disable this behavior.

+

This document describes a failure that occurs when the content in the main viewport viewport is automatically updated, and there is no option for a user to disable this behavior.

Two procedures are presented below to test for the existence of a failure against Success Criterion 3.2.5. Procedure 1 is the preferred procedure and assumes that content authors have access to the code that generates the viewport content.

However there may be instances where this may not be possible (eg: in certain content management systems, application environments such as django or ruby-on-rails, or content generated through scripting languages such as AJAX or PHP that are generated by third parties.) To that end, the second procedure is supplied to allow testing in these instances. Note that timeframes are indicative only, and that any change after any amount of time should be treated as a failure if the test otherwise does not pass the other step evaluations.

Examples

diff --git a/techniques/failures/F69.html b/techniques/failures/F69.html index fcd626e416..78c80854e6 100644 --- a/techniques/failures/F69.html +++ b/techniques/failures/F69.html @@ -26,7 +26,10 @@

Illustration of example 1:

- +
+ +
Example showing text that spills outside of its container, obscuring other text on the page.
+
@@ -43,7 +46,10 @@

Illustration of example 2:

- +
+ +
Example showing text that truncated due to resized text.
+
diff --git a/techniques/failures/F83.html b/techniques/failures/F83.html index 64982eec8e..b28ba69d3c 100644 --- a/techniques/failures/F83.html +++ b/techniques/failures/F83.html @@ -13,7 +13,7 @@

Failure Example 1

Failure Example 2

-

Black text overlays an image with with dark gray areas. Wherever the text crosses a dark gray area the contrast is so bad that the text cannot be read.

+

Black text overlays an image with dark gray areas. Wherever the text crosses a dark gray area the contrast is so bad that the text cannot be read.

Tests

diff --git a/techniques/failures/F90.html b/techniques/failures/F90.html index ade3aa0ccf..ec25d25a26 100644 --- a/techniques/failures/F90.html +++ b/techniques/failures/F90.html @@ -39,7 +39,7 @@

Table content not correctly associated to nested headers

</table>

- Failure example of table incorrectly associating headers attributes in table content (td) to table headers (th).

+ Failure example of table incorrectly associating headers attributes in table content (td) to table headers (th).

Tests

diff --git a/techniques/failures/F91.html b/techniques/failures/F91.html index 3778940163..a34e7723e8 100644 --- a/techniques/failures/F91.html +++ b/techniques/failures/F91.html @@ -49,7 +49,7 @@

Headers not marked up appropriately

</table>

- View example 1 (opens in same browser window) + View example 1 (opens in same browser window)

diff --git a/techniques/failures/img/F69-obscured.gif b/techniques/failures/img/F69-obscured.gif new file mode 100644 index 0000000000..e9f69137c1 Binary files /dev/null and b/techniques/failures/img/F69-obscured.gif differ diff --git a/techniques/failures/img/F69-truncated.gif b/techniques/failures/img/F69-truncated.gif new file mode 100644 index 0000000000..29382f88e2 Binary files /dev/null and b/techniques/failures/img/F69-truncated.gif differ diff --git a/techniques/flash/FLASH1.html b/techniques/flash/FLASH1.html index 17d97f54d6..6a8ac92fd9 100644 --- a/techniques/flash/FLASH1.html +++ b/techniques/flash/FLASH1.html @@ -18,12 +18,12 @@

Applying a textual alternative for a symbol (graphic, button or movieclip)Select the non-text instance on the movie stage, the fields in the Accessibility panel become editable.
  • Enter a meaningful text alternative in the 'name' field, properly describing the purpose of the symbol.
    • -

    - +

    + - The Accessibility panel in the Flash authoring environment. +
    The Accessibility panel in the Flash authoring environment.
    -

    +
    diff --git a/techniques/flash/FLASH10.html b/techniques/flash/FLASH10.html index ae7b4bc154..8a7f9531e8 100644 --- a/techniques/flash/FLASH10.html +++ b/techniques/flash/FLASH10.html @@ -15,13 +15,13 @@

    Adding the word "required" to the control's accessible name

  • Use the Accessibility panel to combine the word "required" with the control's label in the "Name" field.

    • This approach is illustrated in the screenshot below:

    -

    - +

    + - Using the Accessibility panel to indicate a form control as being required +
    Using the Accessibility panel to indicate a form control as being required
    -

    -

    This is demonstrated in the working example of Adding the word "required" to the control's accessible name. The source of Adding the word "required" to the control's accessible name is available.

    +
    +

    This is demonstrated in the working example of Adding the word "required" to the control's accessible name. The source of Adding the word "required" to the control's accessible name is available.

    Tests

    diff --git a/techniques/flash/FLASH11.html b/techniques/flash/FLASH11.html index 89ba5deb2e..9d828a26c0 100644 --- a/techniques/flash/FLASH11.html +++ b/techniques/flash/FLASH11.html @@ -16,7 +16,7 @@

    Making a hidden description visible on request

    The image and descriptive text were taken from a previously published HTML example for long image descriptions on WebAIM.org

    -

    The results for this technique are shown in the working version of Making a hidden description visible on request. The source of Making a hidden description visible on request is available.

    +

    The results for this technique are shown in the working version of Making a hidden description visible on request. The source of Making a hidden description visible on request is available.

    import flash.accessibility. *;
 import fl.accessibility.ButtonAccImpl;
diff --git a/techniques/flash/FLASH12.html b/techniques/flash/FLASH12.html
index 37e9298f44..f7d22840b3 100644
--- a/techniques/flash/FLASH12.html
+++ b/techniques/flash/FLASH12.html
@@ -91,7 +91,7 @@ 
    Validating a text field
    
   zipcode_error_lbl.text = "";
 }
    -

    This approach is demonstrated in working version of Validating a text field. The source of Validating a text field is available.

    +

    This approach is demonstrated in working version of Validating a text field. The source of Validating a text field is available.

    diff --git a/techniques/flash/FLASH13.html b/techniques/flash/FLASH13.html index 594a5b380d..49c470b657 100644 --- a/techniques/flash/FLASH13.html +++ b/techniques/flash/FLASH13.html @@ -39,7 +39,7 @@

    Using the language of the page as whole in the embedded Flash

    </html> -

    This is demonstrated in the working example of Using the language of the page as whole in the embedded Flash. The source of Using the language of the page as whole in the embedded Flash is available.

    +

    This is demonstrated in the working example of Using the language of the page as whole in the embedded Flash. The source of Using the language of the page as whole in the embedded Flash is available.

    diff --git a/techniques/flash/FLASH14.html b/techniques/flash/FLASH14.html index c3998a2f33..a4adca7177 100644 --- a/techniques/flash/FLASH14.html +++ b/techniques/flash/FLASH14.html @@ -67,7 +67,7 @@

    Updating button text with multiple event handlers

    To improve accessibility for screen reader users, the descriptive text is also attached to the buttons themselves as an accessible description. Also note that for button components, the MouseEvent.CLICK event will fire on mouse clicks as well as when the Enter key is pressed.

    -

    This technique is illustrated in the working version of Updating button text with multiple event handlers. The source of Updating button text with multiple event handlers is available.

    +

    This technique is illustrated in the working version of Updating button text with multiple event handlers. The source of Updating button text with multiple event handlers is available.

    Tests

    diff --git a/techniques/flash/FLASH15.html b/techniques/flash/FLASH15.html index 4fd4de5cf5..d2449101e9 100644 --- a/techniques/flash/FLASH15.html +++ b/techniques/flash/FLASH15.html @@ -28,18 +28,18 @@

    You can also use ActionScript code to create a tab-order index for keyboard navigation.

    These steps are illustrated in the screenshots below

    -

    - +

    + - visualizing the tab order +
    visualizing the tab order
    -

    -

    - +

    +
    + - Setting a tab index value in the Accessibility panel +
    Setting a tab index value in the Accessibility panel
    -

    +

    Flash Player no longer requires that you add all of the objects in a FLA file to a list of tab index values. Even if you do not specify a tab index for all objects, a screen reader reads each object correctly.

    @@ -48,7 +48,7 @@

    Using tabIndex to navigate a column structure

    This example contains dynamic TextField instances that are grouped into columns. To ensure the reading order follows the column structure. The TextField instances are given a tab index value that corresponds to their textual content (for example, the TextField containing the text "Sample Text 3" has a tabindex value of 3. Additionally, a single TextField is added that has no tabindex value set. This field contains the text "Not in tab order". Even though this field is visually placed between sample text 2 and 3, it is placed at the end of the custom tab order because it is not assigned a tabindex value.

    -

    The results can be found in the working version of Using tabindex to navigate a column structure. The source of Using tabindex to navigate a column structure is available.

    +

    The results can be found in the working version of Using tabindex to navigate a column structure. The source of Using tabindex to navigate a column structure is available.

    @@ -57,7 +57,7 @@

    Controlling tab order in a two-column layout

    This example contains a Flash based form that is laid out over two columns. To make the tab order follow the column structure, each form control is assigned a tab index value in the Accessibility panel.

    -

    The results are shown in the working version of Controlling tab order in a two-column layout. The source of Controlling tab order in a two-column layout is available.

    +

    The results are shown in the working version of Controlling tab order in a two-column layout. The source of Controlling tab order in a two-column layout is available.

    Tests

    diff --git a/techniques/flash/FLASH16.html b/techniques/flash/FLASH16.html index 70991f1561..3efe00618e 100644 --- a/techniques/flash/FLASH16.html +++ b/techniques/flash/FLASH16.html @@ -26,7 +26,7 @@

    Click event on a button

    e.target.label = "Thanks"; } -

    This approach is demonstrated in the working version of click event on a button. The source of click event on a button is available.

    +

    This approach is demonstrated in the working version of click event on a button. The source of click event on a button is available.

    diff --git a/techniques/flash/FLASH17.html b/techniques/flash/FLASH17.html index ec1e9f3453..b401428e6a 100644 --- a/techniques/flash/FLASH17.html +++ b/techniques/flash/FLASH17.html @@ -35,7 +35,7 @@

    Examples

    -

    The two examples below are shown in the working example of Preventing a keyboard trap in Flash content. The example html file has two Flash contents embedded in it. The first Flash content is embedded with the approach described in example 1. The second example is embedded with the approach described in example 2. The source of Preventing a keyboard trap in Flash content is available. The source zip file contains the SWFFocus class.

    +

    The two examples below are shown in the working example of Preventing a keyboard trap in Flash content. The example html file has two Flash contents embedded in it. The first Flash content is embedded with the approach described in example 1. The second example is embedded with the approach described in example 2. The source of Preventing a keyboard trap in Flash content is available. The source zip file contains the SWFFocus class.

    To run the example from a local drive (as opposed to running it from a web server), the local directory needs to be added to Flash Player's security settings.

    @@ -181,7 +181,7 @@

    Explicitly identifying existing focusable html element

    @@ -135,7 +135,7 @@

    Providing a button in the HTML before the Flash object to stop sound

    </html> -

    This is demonstrated in the working example of Providing a button in the HTML before the Flash object to stop sound. The source of source of Providing a button in the HTML before the Flash object to stop sound is available.

    +

    This is demonstrated in the working example of Providing a button in the HTML before the Flash object to stop sound. The source of source of Providing a button in the HTML before the Flash object to stop sound is available.

    Tests

    diff --git a/techniques/flash/FLASH19.html b/techniques/flash/FLASH19.html index 73f029de7e..308d8ed4b7 100644 --- a/techniques/flash/FLASH19.html +++ b/techniques/flash/FLASH19.html @@ -49,7 +49,7 @@

    Using ActionScript to offer a time limit extension before the timeout expire resetTimeout(); } -

    For a demonstration, see a working example of Using ActionScript to offer a time limit extension before the timeout expires. The source of Using ActionScript to offer a time limit extension before the timeout expires is available.

    +

    For a demonstration, see a working example of Using ActionScript to offer a time limit extension before the timeout expires. The source of Using ActionScript to offer a time limit extension before the timeout expires is available.

    Tests

    diff --git a/techniques/flash/FLASH2.html b/techniques/flash/FLASH2.html index 44f735431e..a1202b5c8c 100644 --- a/techniques/flash/FLASH2.html +++ b/techniques/flash/FLASH2.html @@ -19,12 +19,12 @@

    Applying a Description for a symbol (graphic, button or movieclip)

    Important: Only use the 'Description' field if a short text alternative is not sufficient to describe the objects purpose. Otherwise, leave the 'Description' field empty.

    -

    - +

    + - The Accessibility panel in the Flash authoring environment. +
    The Accessibility panel in the Flash authoring environment.
    -

    +
    diff --git a/techniques/flash/FLASH20.html b/techniques/flash/FLASH20.html index cc6712ecca..7fda900691 100644 --- a/techniques/flash/FLASH20.html +++ b/techniques/flash/FLASH20.html @@ -24,12 +24,12 @@
  • Edit the visual border in the skin's MovieClip. For example, the focus rectangle can be made thicker to stand out more (This step is illustrated in the screenshot below this list).
  • Using ActionScript, associate form component instances with your customized version of focusRectSkin. This can be achieved using the setStyle method.
    • -

    - +

    + - editing a duplicate of focusRectSkin +
    editing a duplicate of focusRectSkin
    -

    +

  • Modifying Existing Skin

    @@ -58,7 +58,7 @@

    A thick blue border to indicate focus

  • FocusIn, FocusOut, MouseOver and MouseOut handlers are assigned to the TextInput instance, which temporarily swap the default "normal" skin with the custom "normal" skin while the component is focused or hovered over.

    • Additionally, the button_over skin is duplicated and modified to change the default mouseover highlights for the button component instance. The checkbox_overIcon and checkbox_selectedOverIcon skins are directly modified, which means those changes will be applied to all checkbox instances.

    -

    The result of this technique can be found in the working version of A thick blue border to indicate focus.

    +

    The result of this technique can be found in the working version of A thick blue border to indicate focus.

    Code for Example 1 (ActionScript 3.0) 
    package wcagSamples {
@@ -119,7 +119,7 @@ 
    A thick blue border to indicate focus
    
   }
 }
    -

    This is demonstrated in working version of A thick blue border to indicate focus. The source of working version of A thick blue border to indicate focus is available.

    +

    This is demonstrated in working version of A thick blue border to indicate focus. The source of working version of A thick blue border to indicate focus is available.

    Tests

    diff --git a/techniques/flash/FLASH21.html b/techniques/flash/FLASH21.html index d6aeba0e75..61608a6c5b 100644 --- a/techniques/flash/FLASH21.html +++ b/techniques/flash/FLASH21.html @@ -8,12 +8,13 @@

    The DataGrid component in Flash only supports column headings, not row headings.

    -

    +

    + - screenshot of highlighted row in grid component +
    screenshot of highlighted row in grid component
    -

    +

    Examples

    A statistical data table

    @@ -55,7 +56,7 @@

    A statistical data table

    dg.move(50, 50); }; -

    This is demonstrated in the working version of A statistical data table. The source of A statistical data table is available.

    +

    This is demonstrated in the working version of A statistical data table. The source of A statistical data table is available.

    Tests

    diff --git a/techniques/flash/FLASH22.html b/techniques/flash/FLASH22.html index edd5ba38c1..af070f0b92 100644 --- a/techniques/flash/FLASH22.html +++ b/techniques/flash/FLASH22.html @@ -21,8 +21,8 @@

    MovieClip used as a button

    keypress. Finally, the custom button is provided an accessible name using the MovieClip's AccessibilityProperties object. This makes the button's label perceivable by assistive technology.

    -

    This result can be viewed in the working - version of MovieClip used as a button. The source of MovieClip used as a button is available.

    +

    This result can be viewed in the working + version of MovieClip used as a button. The source of MovieClip used as a button is available.

    Using a generic MovieClip is generally not recommended, since the custom button will be perceived as a focusable graphic rather than diff --git a/techniques/flash/FLASH23.html b/techniques/flash/FLASH23.html index 92172f6f9d..1b9ad2d59c 100644 --- a/techniques/flash/FLASH23.html +++ b/techniques/flash/FLASH23.html @@ -95,7 +95,7 @@

    Adding a summary to a DataGrid with ActionScript 3

    dg.columns[4].width = 120; }; -

    For a demonstration, see the working version of Adding a summary to a DataGrid with ActionScript 3. The source of Adding a summary to a DataGrid with ActionScript 3 is available.

    +

    For a demonstration, see the working version of Adding a summary to a DataGrid with ActionScript 3. The source of Adding a summary to a DataGrid with ActionScript 3 is available.

    Tests

    diff --git a/techniques/flash/FLASH24.html b/techniques/flash/FLASH24.html index 15a2a0cbe9..dc434b8259 100644 --- a/techniques/flash/FLASH24.html +++ b/techniques/flash/FLASH24.html @@ -57,8 +57,8 @@

    Changing timeout with a dropdown list

    "Your session has expired"); } -

    For a demonstration, see the working - version of Changing timeout with a dropdown list. The source of Changing timeout with a dropdown list is available. Please note that the session times are +

    For a demonstration, see the working + version of Changing timeout with a dropdown list. The source of Changing timeout with a dropdown list is available. Please note that the session times are purposefully short for demonstration purposes, developers will want to provide durations that are sufficient to meet the requirements of Success diff --git a/techniques/flash/FLASH25.html b/techniques/flash/FLASH25.html index 0af1a8e78f..ac99bdf1d5 100644 --- a/techniques/flash/FLASH25.html +++ b/techniques/flash/FLASH25.html @@ -42,7 +42,7 @@

    ActionScript 3

    In ActionScript 3 the accessible name needs to be set on a component's - accessibilityProperties property. This property must be an an instance + accessibilityProperties property. This property must be an instance of flash.accessibility.AccessibilityProperties. If the property has not been set yet, the developer needs to create the a new AccessibilityProperties instance and assign it to the accessibilityProperties property. The @@ -97,7 +97,7 @@

    Setting the accessible name through ActionScript 2.0

    Accessibility.updateProperties(); } -

    This result can be viewed in the working version of Setting the accessible name through ActionScript 2.0. The source of Setting the accessible name through ActionScript 2.0 is available.

    +

    This result can be viewed in the working version of Setting the accessible name through ActionScript 2.0. The source of Setting the accessible name through ActionScript 2.0 is available.

    @@ -127,7 +127,7 @@

    Setting the accessible name through ActionScript 3.0

    } addChild(my_list); -

    This result can be viewed in the working version of Setting the accessible name through ActionScript 3.0. The source of Setting the accessible name through ActionScript 3.0 is available.

    +

    This result can be viewed in the working version of Setting the accessible name through ActionScript 3.0. The source of Setting the accessible name through ActionScript 3.0 is available.

    Tests

    diff --git a/techniques/flash/FLASH26.html b/techniques/flash/FLASH26.html index 5b1ccc0dee..ec395fd4f6 100644 --- a/techniques/flash/FLASH26.html +++ b/techniques/flash/FLASH26.html @@ -98,7 +98,7 @@

    Playing descriptions when cue points are reached

    } } -

    The result can be viewed in the working version of Playing descriptions when cue points are reached. The source of Playing descriptions when cue points are reached is available.

    +

    The result can be viewed in the working version of Playing descriptions when cue points are reached. The source of Playing descriptions when cue points are reached is available.

    diff --git a/techniques/flash/FLASH28.html b/techniques/flash/FLASH28.html index 07605888b6..712177a8b1 100644 --- a/techniques/flash/FLASH28.html +++ b/techniques/flash/FLASH28.html @@ -34,12 +34,12 @@

    Providing a text alternative for ASCII art in the Accessibility control pane

    These steps are ilustrated in the screenshot below:

    -

    - +

    + - Adding text alternative for ASCII art using the Accessibility panel +
    Adding text alternative for ASCII art using the Accessibility panel
    -

    +

    @@ -62,7 +62,7 @@

    Providing a text alternative for ASCII art using ActionScript

    myASCII.accessibilityProperties.forceSimple = true; -

    This technique is demonstrated in the working version of Providing a text alternative for ASCII art using ActionScript. The source of Providing a text alternative for ASCII art using ActionScript is available.

    +

    This technique is demonstrated in the working version of Providing a text alternative for ASCII art using ActionScript. The source of Providing a text alternative for ASCII art using ActionScript is available.

    Tests

    diff --git a/techniques/flash/FLASH29.html b/techniques/flash/FLASH29.html index 9777c58397..d0502f97c9 100644 --- a/techniques/flash/FLASH29.html +++ b/techniques/flash/FLASH29.html @@ -55,19 +55,19 @@

    Setting the label using the Component Inspector panel

    1. Add the Button, CheckBox or RadioButton component to the movie - by dragging it on the the stage from the 'Components' panel.
      2. + by dragging it on the stage from the 'Components' panel.
    2. With the component selected, open the 'Component Inspector' panel by selecting it in the 'Window' menu or using the Shift + F7 shortcut.
    3. In the Component Inspector, under the 'Parameters' tab, enter the label text for the 'label' parameter.

    The screenshot below illustrates this technique.

    -

    - +

    + - Setting a component's label in the Component Inspector Panel +
    Setting a component's label in the Component Inspector Panel
    -

    +
    @@ -100,7 +100,7 @@

    Setting the label on a Button, CheckBox and RadioButton component using Acti myRadioButton.y = 60; addChild(myRadioButton); -

    This technique is demonstrated in the working example of Setting the label on a Button, CheckBox and RadioButton component using ActionScript 3.0. The source of Setting the label on a Button, CheckBox and RadioButton component using ActionScript 3.0 is available.

    +

    This technique is demonstrated in the working example of Setting the label on a Button, CheckBox and RadioButton component using ActionScript 3.0. The source of Setting the label on a Button, CheckBox and RadioButton component using ActionScript 3.0 is available.

    Tests

    @@ -108,7 +108,7 @@

    Setting the label on a Button, CheckBox and RadioButton component using Acti

    When the Button, CheckBox or RadioButton components are used:

    1. confirm that labels describing the purpose of the button have - been provided through the component's label label property.
      2. + been provided through the component's label property.

    Expected Results

    diff --git a/techniques/flash/FLASH30.html b/techniques/flash/FLASH30.html index 64a086f7e4..fd05174680 100644 --- a/techniques/flash/FLASH30.html +++ b/techniques/flash/FLASH30.html @@ -33,7 +33,7 @@

    Accessible name for a simple image button

    navigateToURL(request, '_blank'); } -

    The result is demonstrated in the working version of Accessible name for a simple image button. The source of Accessible name for a simple image button is available.

    +

    The result is demonstrated in the working version of Accessible name for a simple image button. The source of Accessible name for a simple image button is available.

    @@ -68,7 +68,7 @@

    Accessible name for a dynamic image button

    Accessibility.updateProperties(); } -

    The result is demonstrated in the working version of Accessible name for a dynamic image button. The source of Accessible name for a dynamic image button is available.

    +

    The result is demonstrated in the working version of Accessible name for a dynamic image button. The source of Accessible name for a dynamic image button is available.

    Tests

    diff --git a/techniques/flash/FLASH31.html b/techniques/flash/FLASH31.html index 582176c8a1..86c6323cbc 100644 --- a/techniques/flash/FLASH31.html +++ b/techniques/flash/FLASH31.html @@ -110,7 +110,7 @@

    Associating a caption with a DataGrid using ActiveScript 3

    Notes on this code sample:

    Tests

    diff --git a/techniques/flash/FLASH33.html b/techniques/flash/FLASH33.html index faa89bfcfd..bcd5f5053c 100644 --- a/techniques/flash/FLASH33.html +++ b/techniques/flash/FLASH33.html @@ -61,7 +61,7 @@

    Scaling text while keeping a minimum size

    </html> -

    The result of this technique can be viewed in the working version of Scaling text while keeping a minimum size. The source of Scaling text while keeping a minimum size is available.

    +

    The result of this technique can be viewed in the working version of Scaling text while keeping a minimum size. The source of Scaling text while keeping a minimum size is available.

    diff --git a/techniques/flash/FLASH34.html b/techniques/flash/FLASH34.html index 77ab6eb3fc..54008558ee 100644 --- a/techniques/flash/FLASH34.html +++ b/techniques/flash/FLASH34.html @@ -92,7 +92,7 @@

    A SoundHandler class

    } } -

    This technique can be viewed in the working version of A SoundHandler class. The source of A SoundHandler class is available.

    +

    This technique can be viewed in the working version of A SoundHandler class. The source of A SoundHandler class is available.

    Tests

    diff --git a/techniques/flash/FLASH35.html b/techniques/flash/FLASH35.html index 7dc5ec7f7f..3748bb5d5b 100644 --- a/techniques/flash/FLASH35.html +++ b/techniques/flash/FLASH35.html @@ -76,7 +76,7 @@

    A toggle button to pause and resume scrolling

    toggleScroll(false); -

    The technique is demonstrated in the working version of A toggle button to pause and resume scrolling. The source of A toggle button to pause and resume scrolling is available.

    +

    The technique is demonstrated in the working version of A toggle button to pause and resume scrolling. The source of A toggle button to pause and resume scrolling is available.

    Tests

    diff --git a/techniques/flash/FLASH36.html b/techniques/flash/FLASH36.html index 4e4365b74f..d29af992b7 100644 --- a/techniques/flash/FLASH36.html +++ b/techniques/flash/FLASH36.html @@ -23,7 +23,7 @@

    Stopping blinking after a timeout

    } -

    For a demonstration, view the working version of Stopping blinking after a timeout. The source of Stopping blinking after a timeout is available.

    +

    For a demonstration, view the working version of Stopping blinking after a timeout. The source of Stopping blinking after a timeout is available.

    Tests

    diff --git a/techniques/flash/FLASH5.html b/techniques/flash/FLASH5.html index 1bea7e8fb0..d5b13401b8 100644 --- a/techniques/flash/FLASH5.html +++ b/techniques/flash/FLASH5.html @@ -16,22 +16,22 @@
  • Click on the button object on the stage and enter an instance name in the Properties panel.
  • Continue under example 1, 2, or 3 below.
    • -

    - +

    + - screen shot showing the combined button with an instance name 'flashLink1' +
    screen shot showing the combined button with an instance name 'flashLink1'
    -

    +

    Using the Accessibility panel to specify the accessible name

    The Accessibility panel is used to specify the accessible name (which in this case is the same as the visual text).

    -

    - +

    + - screen shot showing use of the Accessibility control panel to provide a name for the combined button +
    screen shot showing use of the Accessibility control panel to provide a name for the combined button
    -

    +
    diff --git a/techniques/flash/FLASH6.html b/techniques/flash/FLASH6.html index 362585380f..846a3159ef 100644 --- a/techniques/flash/FLASH6.html +++ b/techniques/flash/FLASH6.html @@ -23,27 +23,27 @@

    Graphic with accessible clickable regions

    -

    - +

    + - adding the graphic to the Flash authoring stage +
    adding the graphic to the Flash authoring stage
    -

    -

    - +

    +
    + - making a button invisible using the Properties panel +
    making a button invisible using the Properties panel
    -

    -

    - +

    +
    + - setting the button's name using the Accessibility panel +
    setting the button's name using the Accessibility panel
    -

    +
    -

    The result can be seen in the working example of creating accessible hotspots using invisible buttons. The source of creating accessible hotspots using invisible buttons is available.

    +

    The result can be seen in the working example of creating accessible hotspots using invisible buttons. The source of creating accessible hotspots using invisible buttons is available.

    Tests

    diff --git a/techniques/flash/FLASH7.html b/techniques/flash/FLASH7.html index da81e46385..ac5de48467 100644 --- a/techniques/flash/FLASH7.html +++ b/techniques/flash/FLASH7.html @@ -27,7 +27,7 @@

    Using ActionScript to add contextual information directly to the label of a btn4.width = btn1.selected? 200: 100; } -

    The result can be seen in the working example of adding contextual information to a button label. The source of adding contextual information to a button label is available.

    +

    The result can be seen in the working example of adding contextual information to a button label. The source of adding contextual information to a button label is available.

    Tests

    diff --git a/techniques/flash/FLASH8.html b/techniques/flash/FLASH8.html index 8ffd8fdef2..0b8d9c1c3a 100644 --- a/techniques/flash/FLASH8.html +++ b/techniques/flash/FLASH8.html @@ -21,18 +21,18 @@

    Adding a group name to the accessible name of radio buttons

    Flash will concatenate the group name with each button's individual name, such as "gender male".

    This approach is illustrated in the screenshot below:

    -

    - +

    + - Using the Accessibility panel to add a group name to a form control +
    Using the Accessibility panel to add a group name to a form control
    -

    +

    To make the radio buttons in this example accessible, the following two lines need to be added to the movie's script: import fl.accessibility.RadioButtonAccImpl; RadioButtonAccImpl.enableAccessibility();

    -

    For an illustration of this approach, see the working version of Adding a group name to the accessible name of radio buttons. The source of Adding a group name to the accessible name of radio buttons is available.

    +

    For an illustration of this approach, see the working version of Adding a group name to the accessible name of radio buttons. The source of Adding a group name to the accessible name of radio buttons is available.

    @@ -195,7 +195,7 @@

    Programmatically adding a group name with the accessible name of radio butto addChild(myFieldSet); -

    For an illustration of this approach, see the working version of Programmatically adding a group name with the accessible name of radio buttons. The source of Programmatically adding a group name with the accessible name of radio buttons is available.

    +

    For an illustration of this approach, see the working version of Programmatically adding a group name with the accessible name of radio buttons. The source of Programmatically adding a group name with the accessible name of radio buttons is available.

    Adobe Flex allows you to perform this type of behavior by using the <form>, <formitem> and <formheading> elements

    diff --git a/techniques/flash/FLASH9.html b/techniques/flash/FLASH9.html index 12b345d645..c1efdf876e 100644 --- a/techniques/flash/FLASH9.html +++ b/techniques/flash/FLASH9.html @@ -57,7 +57,7 @@

    Adding a timed text caption file to Flash

    </tt> -

    This is demonstrated in working example of Adding a timed text caption file to Flash. The working example of Adding a timed text caption file to Flash is available.

    +

    This is demonstrated in working example of Adding a timed text caption file to Flash. The working example of Adding a timed text caption file to Flash is available.

    Tests

    diff --git a/techniques/flash/img/ac_show_tab_order_view.png b/techniques/flash/img/ac_show_tab_order_view.png new file mode 100644 index 0000000000..deb383f886 Binary files /dev/null and b/techniques/flash/img/ac_show_tab_order_view.png differ diff --git a/techniques/flash/img/acc_name_scrn.jpg b/techniques/flash/img/acc_name_scrn.jpg new file mode 100644 index 0000000000..39cc324d02 Binary files /dev/null and b/techniques/flash/img/acc_name_scrn.jpg differ diff --git a/techniques/flash/img/adjacentbtns.jpg b/techniques/flash/img/adjacentbtns.jpg new file mode 100644 index 0000000000..dd8d43c099 Binary files /dev/null and b/techniques/flash/img/adjacentbtns.jpg differ diff --git a/techniques/flash/img/ascii_art_alternative.png b/techniques/flash/img/ascii_art_alternative.png new file mode 100644 index 0000000000..e41d58eb72 Binary files /dev/null and b/techniques/flash/img/ascii_art_alternative.png differ diff --git a/techniques/flash/img/component_inspector_label.png b/techniques/flash/img/component_inspector_label.png new file mode 100644 index 0000000000..03dc6e1d3d Binary files /dev/null and b/techniques/flash/img/component_inspector_label.png differ diff --git a/techniques/flash/img/editing_focusrect.png b/techniques/flash/img/editing_focusrect.png new file mode 100644 index 0000000000..e09d5bba37 Binary files /dev/null and b/techniques/flash/img/editing_focusrect.png differ diff --git a/techniques/flash/img/findoutmore.jpg b/techniques/flash/img/findoutmore.jpg new file mode 100644 index 0000000000..8c2d178b33 Binary files /dev/null and b/techniques/flash/img/findoutmore.jpg differ diff --git a/techniques/flash/img/flash_hotspot_accessibleName.png b/techniques/flash/img/flash_hotspot_accessibleName.png new file mode 100644 index 0000000000..276f9aa941 Binary files /dev/null and b/techniques/flash/img/flash_hotspot_accessibleName.png differ diff --git a/techniques/flash/img/flash_hotspot_graphic.png b/techniques/flash/img/flash_hotspot_graphic.png new file mode 100644 index 0000000000..37d8e35e7a Binary files /dev/null and b/techniques/flash/img/flash_hotspot_graphic.png differ diff --git a/techniques/flash/img/flash_hotspot_invisible.png b/techniques/flash/img/flash_hotspot_invisible.png new file mode 100644 index 0000000000..ad277dfaf4 Binary files /dev/null and b/techniques/flash/img/flash_hotspot_invisible.png differ diff --git a/techniques/flash/img/groupname.png b/techniques/flash/img/groupname.png new file mode 100644 index 0000000000..527e1613f8 Binary files /dev/null and b/techniques/flash/img/groupname.png differ diff --git a/techniques/flash/img/required_flash_control.png b/techniques/flash/img/required_flash_control.png new file mode 100644 index 0000000000..d8d5e999a8 Binary files /dev/null and b/techniques/flash/img/required_flash_control.png differ diff --git a/techniques/flash/img/setting_tabindex_in_accessibility_panel.png b/techniques/flash/img/setting_tabindex_in_accessibility_panel.png new file mode 100644 index 0000000000..694ff027eb Binary files /dev/null and b/techniques/flash/img/setting_tabindex_in_accessibility_panel.png differ diff --git a/techniques/flash/img/using_auto_label.png b/techniques/flash/img/using_auto_label.png new file mode 100644 index 0000000000..4752de65a1 Binary files /dev/null and b/techniques/flash/img/using_auto_label.png differ diff --git a/techniques/general/G102.html b/techniques/general/G102.html index c3c158e9d1..cda76e2413 100644 --- a/techniques/general/G102.html +++ b/techniques/general/G102.html @@ -5,36 +5,38 @@

    An abbreviation is the shortened form of a word, phrase, or name. For most abbreviations, providing the full word, phrase, or name is sufficient.

    Some abbreviations represent words or phrases that are borrowed from a foreign language. For instance, many commonly used abbreviations in English are derived from Latin phrases, such as the short list of examples given below. The expanded form is only provided here as background information. For this category of abbreviations, providing an explanation is more helpful than the original expanded form, and the explanation of the abbreviation is provided instead of the expansion.

    - - - Abbreviation - Latin expansion - Explanation - - - - - a.m. - ante meridiem - before noon; in the morning - - - p.m. - post meridiem - after noon; in the afternoon - - - e.g. - exempli gratia - for example - - - cf - confer/conferatur - compare - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    AbbreviationLatin expansionExplanation
    a.m.ante meridiembefore noon; in the morning
    p.m.post meridiemafter noon; in the afternoon
    e.g.exempli gratiafor example
    cfconfer/conferaturcompare
    +

    If abbreviations do not need an expansion (for example, because the original expansion has been rejected by the organization that it refers to or if the abbreviation has become part of the language), provide an explanation, if appropriate, or treat the abbreviation as a word that does not require explanation.

    Examples

    diff --git a/techniques/general/G156.html b/techniques/general/G156.html index 280328a265..64a461d6cd 100644 --- a/techniques/general/G156.html +++ b/techniques/general/G156.html @@ -14,7 +14,7 @@
    1. Open the Web page in a browser that allows users to change colors of HTML content.
    2. Change the foreground and background colors in the browser settings so they are different than those specified in the content.
      3. -
    3. Return to the page and check that that the new specified foreground text and background colors in the browser override the colors specified in the content.
      4. +
    4. Return to the page and check that the new specified foreground text and background colors in the browser override the colors specified in the content.

    Expected Results

    diff --git a/techniques/general/G162.html b/techniques/general/G162.html index 93710a529c..10a161d70e 100644 --- a/techniques/general/G162.html +++ b/techniques/general/G162.html @@ -9,25 +9,28 @@

    Labels above text fields

    -

    - -

    +
    + +
    Two form fields with labels positioned immediately above them.
    +

    Labels to the left of text fields

    -

    - -

    +
    + +
    Two form fields with labels positioned immediately to the left.
    +

    Labels to the right of radio buttons

    -

    - -

    +
    + +
    A group of form controls contains two radio buttons with labels positioned to the right of the radio buttons.
    +

    Tests

    diff --git a/techniques/general/G167.html b/techniques/general/G167.html index 7f8266c9fe..cdfd15b2b4 100644 --- a/techniques/general/G167.html +++ b/techniques/general/G167.html @@ -11,7 +11,10 @@

    A search function

    A Web page contains a text field where the user can enter search terms and a button labeled "Search" for performing the search. The button is positioned right after the text field so that it is clear to the user that the text field is where to enter the search term.

    - +
    + +
    A text field with a button positioned to the right demonstrating the use of a button to label a field.
    +
    diff --git a/techniques/general/G175.html b/techniques/general/G175.html index 707b1a9125..67fe401831 100644 --- a/techniques/general/G175.html +++ b/techniques/general/G175.html @@ -8,11 +8,17 @@

    The user may type hex values into the text fields. The "pick" link will open a color selection tool for the adjoining field.

    - +
    + +
    Screenshot showing the foreground and background color controls, which are text fields containing hex values. Each field has a link which opens a color picker control positioned between the label and the text field.
    +

    The color selection tool opened for selecting a color.

    - +
    + +
    Screenshot showing the color selection tool with the color picker opened to select a color for the foreground. The user is presented with a choice of 216 colors.
    +

    Here is a working example of this technique implemented using PHP, Javascript, CSS and XHTML: - Color Picker Example.

    + Color Picker Example.

    Tests

    diff --git a/techniques/general/G183.html b/techniques/general/G183.html index 18cc456e1c..893a5d2ffe 100644 --- a/techniques/general/G183.html +++ b/techniques/general/G183.html @@ -16,7 +16,7 @@

    Colors that would provide 3:1 contrast with black words and 4.5:1 contrast with a white background

    Refer to - Links with a 3:1 contrast ratio with surrounding text + Links with a 3:1 contrast ratio with surrounding text

    diff --git a/techniques/general/G201.html b/techniques/general/G201.html index ad55834e69..f3a62ada96 100644 --- a/techniques/general/G201.html +++ b/techniques/general/G201.html @@ -82,7 +82,7 @@

    Using CSS to provide a warning before opening a new window

    A - working + working example of Using CSS to provide a warning before opening a new window is available.

    diff --git a/techniques/general/G56.html b/techniques/general/G56.html index 3130f1a44d..142aee8f30 100644 --- a/techniques/general/G56.html +++ b/techniques/general/G56.html @@ -24,13 +24,16 @@

    Sufficient audio contrast between a narrator and background music

    This example demonstrates a voice with music in the background in which the voice is the appropriate 20 DB above the background. The voice (foreground) is recorded at -17.52 decibels (average RMS) and the music (background) is at -37.52 decibels, which makes the foreground 20 decibels louder than the background.

    Audio example

    - Audio Example: Foreground is 20 decibels above the background (mp3) + Audio Example: Foreground is 20 decibels above the background (mp3)

    Transcript of audio example (good contrast):

    "Usually the foreground refers to a voice that is speaking and should be understood. My speaking voice right now is 20 decibels above the background which is the music. This is an example of how it should be done.."

    Visual example of the recording above

    The audio example above is visually represented below in a snapshot of the file in an audio editor. A section is highlighted that contains foreground and background. It is a much larger wave than the section that contains only background.

    - +
    + +
    Visual representation of sufficient contrast.
    +
    @@ -39,13 +42,16 @@

    Insufficient Audio Contrast between a narrator and background music

    Audio example of the failure

    This example demonstrates a voice with music in the background in which the voice is not 20 DB above the background. The voice (foreground) is at -18 decibels and the music (background) is at about -16 decibels making the foreground only 2 decibels louder than the background.

    - Audio Example: Foreground is less than 20 decibels above the background (mp3) + Audio Example: Foreground is less than 20 decibels above the background (mp3)

    Transcript of audio example (bad contrast):

    "This is an example of a voice that is not loud enough against the background. The voice which is the foreground is only about 2 decibels above the background. Therefore is difficult to understand for a person who is hard of hearing. It is hard to discern one word from the next. This is an example of what not to do."

    Visual example of the failure

    The highlighted section contains foreground and background. The wave is almost the same size the section that contains only background, which means the background is too loud in comparison to the foreground voice.

    - +
    + +
    Visual representation of bad contrast.
    +

    Tests

    diff --git a/techniques/general/G65.html b/techniques/general/G65.html index 143d7e1f6b..eb97da069e 100644 --- a/techniques/general/G65.html +++ b/techniques/general/G65.html @@ -54,7 +54,7 @@ nav > h2{ font-size: 1em; } ul { padding-left: 0em; } -

    Working example: Breadcrumb example

    +

    Working example: Breadcrumb example

    Tests

    diff --git a/techniques/general/img/Audio_3.jpg b/techniques/general/img/Audio_3.jpg new file mode 100644 index 0000000000..12fea0a533 Binary files /dev/null and b/techniques/general/img/Audio_3.jpg differ diff --git a/techniques/general/img/Audio_4.jpg b/techniques/general/img/Audio_4.jpg new file mode 100644 index 0000000000..c4dfd9db54 Binary files /dev/null and b/techniques/general/img/Audio_4.jpg differ diff --git a/techniques/general/img/button-as-label.jpg b/techniques/general/img/button-as-label.jpg new file mode 100644 index 0000000000..e75d6ed489 Binary files /dev/null and b/techniques/general/img/button-as-label.jpg differ diff --git a/techniques/general/img/colorpicker.jpg b/techniques/general/img/colorpicker.jpg new file mode 100644 index 0000000000..e469fdd992 Binary files /dev/null and b/techniques/general/img/colorpicker.jpg differ diff --git a/techniques/general/img/lbl-position_01.gif b/techniques/general/img/lbl-position_01.gif new file mode 100644 index 0000000000..1264a2f03f Binary files /dev/null and b/techniques/general/img/lbl-position_01.gif differ diff --git a/techniques/general/img/lbl-position_02.gif b/techniques/general/img/lbl-position_02.gif new file mode 100644 index 0000000000..4ab61562f6 Binary files /dev/null and b/techniques/general/img/lbl-position_02.gif differ diff --git a/techniques/general/img/lbl-position_03.gif b/techniques/general/img/lbl-position_03.gif new file mode 100644 index 0000000000..7c3aba9c65 Binary files /dev/null and b/techniques/general/img/lbl-position_03.gif differ diff --git a/techniques/general/img/opencolorpicker.jpg b/techniques/general/img/opencolorpicker.jpg new file mode 100644 index 0000000000..5bc22ffe74 Binary files /dev/null and b/techniques/general/img/opencolorpicker.jpg differ diff --git a/techniques/html/H30.html b/techniques/html/H30.html index 20bf2555b1..250f0d274d 100644 --- a/techniques/html/H30.html +++ b/techniques/html/H30.html @@ -86,7 +86,7 @@ <p>Read more</p> </a> </article> -

    This is shown in the working example of using a link to wrap block level elements. +

    This is shown in the working example of using a link to wrap block level elements.

    Tests

    diff --git a/techniques/html/H48.html b/techniques/html/H48.html index 8551e29bb4..ca32d06b66 100644 --- a/techniques/html/H48.html +++ b/techniques/html/H48.html @@ -66,7 +66,7 @@

    Contact information using a definition list

    dt span{display: inline-block; width: 70px;} dd span{display: inline-block; margin-right: 5px;} -

    This is shown in the working example of Contact information using a definition list +

    This is shown in the working example of Contact information using a definition list

    diff --git a/techniques/html/H49.html b/techniques/html/H49.html index 1a1fa820e0..e6318ce814 100644 --- a/techniques/html/H49.html +++ b/techniques/html/H49.html @@ -11,7 +11,7 @@ markup. Some assistive technologies provide a mechanism for determining the characteristics of content that has been created using proper semantic markup.

    Examples

    -

    See rendered examples of semantic +

    See rendered examples of semantic text.

    diff --git a/techniques/html/H74.html b/techniques/html/H74.html index 931e2824bb..8af4a70082 100644 --- a/techniques/html/H74.html +++ b/techniques/html/H74.html @@ -25,7 +25,7 @@

    HTML

    XHTML

    -

    Like other other XML-based documents, XHTML documents reference a Document Type +

    Like other XML-based documents, XHTML documents reference a Document Type Definition (DTD) or other type of XML schema. The developer can use online or offline validators (including validation tools built into editors) to check that opening and closing tags are used according to the specification.

    diff --git a/techniques/html/H91.html b/techniques/html/H91.html index 4600f5e103..8ca9397ade 100644 --- a/techniques/html/H91.html +++ b/techniques/html/H91.html @@ -5,105 +5,109 @@

    User agents provide the keyboard operation of HTML form controls and links. In addition, the user agent maps the form controls and links to an accessibility API. Assistive technologies use the accessibility API to extract appropriate accessibility information, such as role, name, state, and value, and present them to users. The role is provided by the HTML element, and the name is provided by the text associated with that element. Elements for which values and states are appropriate also expose the values and states via multiple mechanisms.

    In some cases, the text is already associated with the control through a required attribute. For example, submit buttons use the button element text or image 'alt' attribute as the name. In the case of form controls, label elements or 'title' attributes are used. The following table describes how the role, name, value, and state are determined for HTML links and form controls.

    - - - HTML element - Role - Name - Value - State - - - - - <a> - link - 'title' attribute, text within <a> element or 'alt' attribute if image link. Concatenated if both text and image 'alt' attribute are provided - 'href' attribute - - - - <button> - push button - text inside <button> element or 'title' attribute - - - - - <fieldset> - grouping - text inside <legend> element within fieldset element - - - - - <input type = "button", "submit", or "reset"> - push button - 'value' attribute - - - - - <input type = "image"> - push button - 'alt' attribute or 'title' attribute - - - - - <input type = "text"> - editable text - <label> element associated with it or 'title' attribute - 'value' attribute - - - - <input type = "password"> - editable text - <label> element associated with it or 'title' attribute - value is purposefully hidden - - - - <input type="file"> - editable text - <label> element associated with it or 'title' attribute - 'value' attribute - - - <input type="checkbox"> - checkbox - <label> element associated with it or 'title' attribute - - 'checked' attribute - - - - <input type="radio"> - radio button - <label> element associated with it or 'title' attribute - - 'checked' attribute - - - - - - <select> - list box - <label> element associated with it or 'title' attribute - <option> element with 'selected' attribute set to "selected" - - - - <textarea> - editable text - <label> element associated with it or 'title' attribute - text within <textarea> element - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    HTML element RoleName Value State
    <a> link 'title' attribute, text within <a> element or 'alt' attribute if image link. Concatenated if both text and image 'alt' attribute are provided 'href' attribute
    <button> push button text inside <button> element or 'title' attribute
    <fieldset> grouping text inside <legend> element within fieldset element
    <input type = "button", "submit", or "reset"> push button 'value' attribute
    <input type = "image"> push button 'alt' attribute or 'title' attribute
    <input type = "text"> editable text <label> element associated with it or 'title' attribute 'value' attribute
    <input type = "password"> editable text <label> element associated with it or 'title' attribute value is purposefully hidden
    <input type="file"> editable text <label> element associated with it or 'title' attribute 'value' attribute
    <input type="checkbox"> checkbox <label> element associated with it or 'title' attribute 'checked' attribute +
    <input type="radio"> radio button <label> element associated with it or 'title' attribute 'checked' attribute + +
    <select> list box <label> element associated with it or 'title' attribute <option> element with 'selected' attribute set to "selected"
    <textarea> editable text <label> element associated with it or 'title' attribute text within <textarea> element
    +

    Examples

    Links

    diff --git a/techniques/index.html b/techniques/index.html index 0e3054c847..ff0b7cad73 100644 --- a/techniques/index.html +++ b/techniques/index.html @@ -7,8 +7,8 @@ - - + + diff --git a/techniques/pdf/PDF1.html b/techniques/pdf/PDF1.html index dcef04d7eb..ba6a75cad6 100644 --- a/techniques/pdf/PDF1.html +++ b/techniques/pdf/PDF1.html @@ -23,27 +23,27 @@

    Adding an /Alt entry to an image using Adobe Acrobat

    1. Choose Tools > Advanced Editing > TouchUp Object Tool

      -

      - +

      + - The TouchUp Object Tool in the Advanced Editing menu. +
      The TouchUp Object Tool in the Advanced Editing menu.
      -

      +
    2. Access the context menu for the image and choose Properties.
    3. On the TouchUp Properties dialog, select the Tag tab.

    4. On the Tag panel, type the text alternative in the Alternate Text text box.

      -

      - +

      + - The Tag Tab in the TouchUp Properties dialog. +
      The Tag Tab in the TouchUp Properties dialog.
      -

      +
    -

    This example is shown in operation in the working example of Adding an /Alt entry to an image.

    +

    This example is shown in operation in the working example of Adding an /Alt entry to an image.

    @@ -55,24 +55,24 @@

    Adding an /Alt entry to an image using Adobe Acrobat

  • Choose Tools > Advanced Editing > TouchUp Reading Order Tool

    -

    - +

    + - The TouchUp Reading Order Tool in the Advanced Editing menu. +
    The TouchUp Reading Order Tool in the Advanced Editing menu.
    -

    +
  • The TouchUp Reading Order dialog will be displayed.
  • Right-click on the image and choose Edit Alternate Text.
  • The Alternate Text dialog will be displayed.

  • Type the text alternative in the Alternate Text text box.

    -

    - +

    + - The Alternate Text box. +
    The Alternate Text box.
    -

    +
    • @@ -83,36 +83,36 @@

    Adding an /Alt entry to an image in PDF documents generated

    This example is shown with Microsoft Word. There are other software tools that perform similar functions. See the list of other software tools in .

    - - Word 2000-2003 +
    +

    Word 2000-2003

    1. Right-click on the image and choose Format Picture
    2. Select the Web tab
    3. Type the alternative text into the text box provided and then click OK.
    -

    - +

    + - The Web tab in the Format Picture dialog. +
    The Web tab in the Format Picture dialog.
    -

    - - - Word 2007 +
    +
    +
    +

    Word 2007

    1. Right-click on the image and choose Size
    2. Select the Alt Text tab
    3. Type the alternative text into the text box provided and then click OK.
    -

    - +

    + - The Alt Text tab in the Size dialog. +
    The Alt Text tab in the Size dialog.
    -

    - +
    +

    @@ -127,12 +127,12 @@

    Adding an /Alt entry to an image in PDF documents generated
  • Type the alternative text into Alternate (Text Only) text box and click OK.
    • -

    - +

    + - The Options tab in the Picture... dialog. +
    The Options tab in the Picture... dialog.
    -

    +

    diff --git a/techniques/pdf/PDF10.html b/techniques/pdf/PDF10.html index 32293ceb9b..1dd63f83ba 100644 --- a/techniques/pdf/PDF10.html +++ b/techniques/pdf/PDF10.html @@ -31,8 +31,8 @@ 3 below and Table 220 in PDF 1.7 (ISO 32000-1)). Therefore, add a tooltip to each field to provide a label that assistive technology can interpret.

    - - Placement rules +
    +

    Placement rules

    The table below lists the placement rules governing where Adobe LiveCycle positions labels by default. Note that these rules assume left-to-right text directionality. If your form requires different positioning (e.g., @@ -41,59 +41,62 @@ 2 below. In general, authors should review label positioning to make sure it meets the requirements of their particular form.

    - - - Control Type - LiveCycle Placement Rules - - - - Text input (including date/time and password fields) - - Default placement for the label is to the left of the control. - If this is not possible, LiveCycle will attempt to place it - immediately above the control. - - - - Checkbox - - Default placement for the label is to the right of the check - box. - - - - Radio button group - - Default placement for the label for each individual radio - button is to the right of the button. - Create a visible caption for the radio button group by creating - static text and placing it to the left of or above the group. - (See Labeling radio buttons below.) - - - - Combo box - - Default placement for the label is to the left of the drop-down - list. If this is not possible, LiveCycle will attempt to place - it immediately above the control.. - - - - List box - - Default placement for the label is above the list box. - - - - Button - - LiveCycle automatically places the label on the button; - it does not have to be positioned manually. Ensure that the - button's purpose is properly described in the label text. - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    Control Type LiveCycle Placement Rules
    + Text input (including date/time and password fields) + Default placement for the label is to the left of the control. + If this is not possible, LiveCycle will attempt to place it + immediately above the control.
    + Checkbox + Default placement for the label is to the right of the check + box.
    + Radio button group + Default placement for the label for each individual radio + button is to the right of the button. + Create a visible caption for the radio button group by creating + static text and placing it to the left of or above the group. + (See Labeling radio buttons below.)
    + Combo box + Default placement for the label is to the left of the drop-down + list. If this is not possible, LiveCycle will attempt to place + it immediately above the control..
    + List box + Default placement for the label is above the list box.
    + Button + LiveCycle automatically places the label on the button; + it does not have to be positioned manually. Ensure that the + button's purpose is properly described in the label text.
    +

    Examples

    @@ -115,13 +118,13 @@

    Providing labels using the Forms tool in Adobe Acrobat

    The following image shows the Properties dialog with a description in the Tooltip field.

    -

    - +

    + - The Properties dialog for a form field. A short description, including the format required for the field, is added and will appear as a tooltip. +
    The Properties dialog for a form field. A short description, including the format required for the field, is added and will appear as a tooltip.
    -

    -

    This example is shown in operation in the working example of providing labels using the forms tool.

    +
    +

    This example is shown in operation in the working example of providing labels using the forms tool.

    @@ -136,9 +139,9 @@

    Providing labels to form controls in Adobe LiveCycle Designer also ensure that the label is programmatically associated with the form control and that sufficient information is provided so that screen reader users can readily complete and submit the form.

    -

    This example is shown in operation in the working example of providing labels in LiveCycle Designer.

    - - Specifying accessible label text using the accessibility palette +

    This example is shown in operation in the working example of providing labels in LiveCycle Designer.

    +
    +

    Specifying accessible label text using the accessibility palette

    In LiveCycle Designer, create or import a form. Then:

    1. Enable the palette by selecting Window > Accessibility or by @@ -147,12 +150,12 @@

      Providing labels to form controls in Adobe LiveCycle Designer
    2. Select an object in your form. The palette shows the object's accessibility properties.

    -

    - +

    + - Image of Adobe LiveCycle Accessibility Palette showing the Precedence drop down list. Text is announced in the order shown in the list: custom text, tool tip, caption, and name. +
    Image of Adobe LiveCycle Accessibility Palette showing the Precedence drop down list. Text is announced in the order shown in the list: custom text, tool tip, caption, and name.
    -

    +

    The label that a screen reader uses does not necessarily have to be the same as the visual caption. In some cases, you may want to provide more information about a form element's purpose.

    @@ -171,15 +174,15 @@

    Providing labels to form controls in Adobe LiveCycle Designer the preferred date format (shown as screen text). So this text is provided in the tooltip. Because a tooltip has a higher precedence than the visual caption, the screen reader uses the tooltip.

    -

    - +

    + - Image of a date form field in LiveCycle Designer showing tooltip text for a date format. +
    Image of a date form field in LiveCycle Designer showing tooltip text for a date format.
    -

    - - - Labeling radio buttons +
    +

    +
    +

    Labeling radio buttons

    When a screen reader user tabs into a radio button, the screen reader needs to announce two items:

      @@ -201,15 +204,15 @@

      Providing labels to form controls in Adobe LiveCycle Designer button. For example, type "Cash."
    • Repeat steps 3 and 4 for each radio button in the group.
      • -

      - +

      + - Image of Custom Screen Reader Text for radio buttons in LiveCycle Designer. +
      Image of Custom Screen Reader Text for radio buttons in LiveCycle Designer.
      -

      - - - Repositioning form labels +
      +

    +
    +

    Repositioning form labels

    The placement of a caption, or label, is important because users expect them to be found at a particular location adjacent to the control. For screen magnification users this is even more important, as they @@ -226,22 +229,22 @@

    Providing labels to form controls in Adobe LiveCycle Designer
  • In the Layout palette, under Caption at the bottom of the palette, select the position of your object from the Position drop-down list.
    • -

    - +

    + - The Layout palette and the new Caption position. +
    The Layout palette and the new Caption position.
    -

    +

    The resulting repositioned label is shown below. The label for the Date text field has been moved from the left of the field to the line above the field.

    -

    - +

    + - A form label repositioned above the field; also shown are default label positions to the left of text fields. +
    A form label repositioned above the field; also shown are default label positions to the left of text fields.
    -

    - +
    +

    diff --git a/techniques/pdf/PDF11.html b/techniques/pdf/PDF11.html index 9b95c0030f..de54a7b3da 100644 --- a/techniques/pdf/PDF11.html +++ b/techniques/pdf/PDF11.html @@ -82,29 +82,29 @@

    Creating a hyperlink using the Create Link dialog in Adobe
  • Select the text that will become the link text.
  • Access the context menu and select Create Link.
    • -

    - +

    + - Image of a PDF document with text selected to create a hyperlink. The context menu shows Create Link selected. +
    Image of a PDF document with text selected to create a hyperlink. The context menu shows Create Link selected.
    -

    +

    3. Follow the instructions in the Create Link dialog to specify the link appearance, as shown below.

    -

    - +

    + - Image of a PDF document with the Create Link dialog open and link appearance options selected. +
    Image of a PDF document with the Create Link dialog open and link appearance options selected.
    -

    +

    Then select Next and specify the URI. The image below shows the resulting hyperlink and tooltip.

    -

    - +

    + - Image of a PDF document with a hyperlink created using the Create Link dialog, including the resulting tooltip on mouseover. +
    Image of a PDF document with a hyperlink created using the Create Link dialog, including the resulting tooltip on mouseover.
    -

    -

    This example is shown in operation in the working example of creating a hyperlink in PDF.

    +
    +

    This example is shown in operation in the working example of creating a hyperlink in PDF.

    diff --git a/techniques/pdf/PDF12.html b/techniques/pdf/PDF12.html index 75a083f654..c82cafcecd 100644 --- a/techniques/pdf/PDF12.html +++ b/techniques/pdf/PDF12.html @@ -15,126 +15,133 @@ 1.7 (ISO 32000-1), as shown in the following table. The Comments column explains how Adobe Acrobat Pro displays the corresponding information.

    - - Interactive Form Dictionary Entries - Used to Define - Comments - - - FT - Role - Controls that share field type also use field flags to set - the appropriate role. In Adobe Acrobat the role for form controls - is set automatically. - - - TU - Name - In Adobe Acrobat the TU entry value is provided via the Tooltip - field in the form control's Properties dialog. This should - not be confused with the T entry which is defined as the Name - in Acrobat's form control properties dialog - the name field - in the Properties dialog is not used to provide the name for - a control when read by assistive technologies. - - - CA - Name (Pushbuttons only) - In Adobe Acrobat the CA entry value is provided via the label - field in the form control's Properties dialog. - - - V - Value - The Value entry is set by the user interacting with the control, - where a value is needed. - - - DV - Default Value - In Adobe Acrobat the DV entry value can be set in the form - control's Properties dialog. - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    Interactive Form Dictionary EntriesUsed to DefineComments
    FTRoleControls that share field type also use field flags to set + the appropriate role. In Adobe Acrobat the role for form controls + is set automatically.
    TUNameIn Adobe Acrobat the TU entry value is provided via the Tooltip + field in the form control's Properties dialog. This should + not be confused with the T entry which is defined as the Name + in Acrobat's form control properties dialog - the name field + in the Properties dialog is not used to provide the name for + a control when read by assistive technologies.
    CAName (Pushbuttons only)In Adobe Acrobat the CA entry value is provided via the label + field in the form control's Properties dialog.
    VValueThe Value entry is set by the user interacting with the control, + where a value is needed.
    DVDefault ValueIn Adobe Acrobat the DV entry value can be set in the form + control's Properties dialog.
    +

    The following table describes how the role, name, value, and state are defined for PDF form controls created using Adobe Acrobat Pro. Adobe LiveCycle Designer provides the same controls as well as several additional ones: see Example 2 below.

    - - - PDF form element - Role (FT entry) - Name (TU entry) - Value (V entry) - Configurable States - - - Text field - Text - /Tx - - Tooltip - Default value (DV entry in field dictionary) can be set in - the Properties dialog. Value is entered by user. - Read Only, Required, Multiline, Password - - - Check box - Check box - /Btn - - Tooltip - V entry is set to 'Yes' or 'No' depending on Checked state. - Read Only, Required, Checked - - - Radio button - Radio button - /Btn (Field Flag set to 'Radio') - Tooltip - V entry is set to 'Yes' or 'No' depending on Checked state. - Read Only, Required, Checked - - - Combo box - Combo box - /Ch (Field Flag set to 'Combo') - Tooltip - Default value (/DV) can be set in the Properties dialog. - Value is determined by user selection. - Read Only, Required - - - List box - Drop-down list - /Ch - - Tooltip - Default value (/DV) can be set in the Properties dialog. - Value is determined by user selection. - Read Only, Required - - - Button - Push button - /Btn (Field Flag set to 'Pushbutton') - Label (CA entry instead of TU entry) - Push buttons do not have or require a value. - Read Only, Required - - - Signature field - Text - /Sig - - Tooltip - Default value (DV entry in field dictionary) can be set in - the Properties dialog. Value is entered by user. - Read Only, Required - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    PDF form element Role (FT entry) Name (TU entry)Value (V entry)Configurable States
    Text fieldText + /Tx + TooltipDefault value (DV entry in field dictionary) can be set in + the Properties dialog. Value is entered by user.Read Only, Required, Multiline, Password
    Check boxCheck box + /Btn + TooltipV entry is set to 'Yes' or 'No' depending on Checked state.Read Only, Required, Checked
    Radio buttonRadio button + /Btn (Field Flag set to 'Radio')TooltipV entry is set to 'Yes' or 'No' depending on Checked state.Read Only, Required, Checked
    Combo boxCombo box + /Ch (Field Flag set to 'Combo') TooltipDefault value (/DV) can be set in the Properties dialog. + Value is determined by user selection.Read Only, Required
    List boxDrop-down list + /Ch + TooltipDefault value (/DV) can be set in the Properties dialog. + Value is determined by user selection.Read Only, Required
    ButtonPush button + /Btn (Field Flag set to 'Pushbutton')Label (CA entry instead of TU entry)Push buttons do not have or require a value.Read Only, Required
    Signature fieldText + /Sig + TooltipDefault value (DV entry in field dictionary) can be set in + the Properties dialog. Value is entered by user.Read Only, Required
    +

    Examples

    @@ -157,21 +164,21 @@

    Specifying name, role, value and/or state for a form field

    The image below shows the Check Box Properties dialog, open in the General tab. (The Name field in the dialog is not needed for accessibility.)

    -

    - +

    + - General tab on the Check Box Properties dialog, showing name and tool tip fields for a check box +
    General tab on the Check Box Properties dialog, showing name and tool tip fields for a check box
    -

    +

    The image below shows the Check Box Properties dialog, open in the Options tab.

    -

    - +

    + - Options tab on the Check Box Properties dialog, showing value and state fields for a check box. +
    Options tab on the Check Box Properties dialog, showing value and state fields for a check box.
    -

    -

    This example is shown in operation in the working example of specifying name, role, value using Acrobat Pro.

    +
    +

    This example is shown in operation in the working example of specifying name, role, value using Acrobat Pro.

    @@ -183,38 +190,38 @@

    Specifying name, value, and state for a form field using form objects and the Object Palette to specify name, role, state or value for the object.

    The following image shows the Object Palette.

    -

    - +

    + - LiveCycle Designer Object Library showing the form objects available for form creation. +
    LiveCycle Designer Object Library showing the form objects available for form creation.
    -

    +

    The following three images show the tabs in the Object palette. In the first the Field tab is open for specifying the type (or role) of the field.

    -

    - +

    + - LiveCycle Designer Object palette, Field tab. +
    LiveCycle Designer Object palette, Field tab.
    -

    +

    The next image shows the Value tab, with options that can be applied to the field.

    -

    - +

    + - LiveCycle Designer Object palette, Value tab options. +
    LiveCycle Designer Object palette, Value tab options.
    -

    +

    The third images shows the Binding tab, specifying the name of the field.

    -

    - +

    + - LiveCycle Designer Object palette, Binding tab. +
    LiveCycle Designer Object palette, Binding tab.
    -

    -

    This example is shown in operation in the working example of specifying name, role, value using LiveCycle Designer.

    +
    +

    This example is shown in operation in the working example of specifying name, role, value using LiveCycle Designer.

    diff --git a/techniques/pdf/PDF13.html b/techniques/pdf/PDF13.html index af5cedfe84..23d1b95ead 100644 --- a/techniques/pdf/PDF13.html +++ b/techniques/pdf/PDF13.html @@ -33,12 +33,12 @@

    Adding alternate link text using Adobe Acrobat 9 Pro

    The image below shows a document converted to PDF from Oracle Open Office. Note that the visible link text is the URL for the link target. A screen reader will read the entire URI as the link text.

    -

    - +

    + - A document with the link URI as the link text. +
    A document with the link URI as the link text.
    -

    +

    To create more accessible link text for assistive technology:

    1. In the View menu, open the Tag panel by selecting Navigation Panels > Tags.
      2. @@ -49,22 +49,22 @@

      Adding alternate link text using Adobe Acrobat 9 Pro

      instead of the entire URI.

    The next image shows the Link tag structure in the Tag panel.

    -

    - +

    + - The Link tag structure in the tag panel. +
    The Link tag structure in the tag panel.
    -

    +

    The last image shows the Alternate Text specified in the Link tag's TouchUp Properties dialog. A screen reader will read the Alternate Text as the link text.

    -

    - +

    + - The new Alternate Text: 'Boston Globe technology page' +
    The new Alternate Text: 'Boston Globe technology page'
    -

    -

    This example is shown in operation in the working example of adding alternate link text (OpenOffice file) and working example of adding alternate link text (PDF file).

    +
    +

    This example is shown in operation in the working example of adding alternate link text (OpenOffice file) and working example of adding alternate link text (PDF file).

    diff --git a/techniques/pdf/PDF14.html b/techniques/pdf/PDF14.html index 9f3d05e9ed..c73ae985e1 100644 --- a/techniques/pdf/PDF14.html +++ b/techniques/pdf/PDF14.html @@ -39,41 +39,41 @@

    Adding running headers and footers using Microsoft Word

    In Microsoft Word, use the Insert ribbon, which allows you to specify header, footer, and page number information and layout, as shown in the following images.

    -

    - +

    + - Header and Footer tools on the Word Insert ribbon. +
    Header and Footer tools on the Word Insert ribbon.
    -

    +

    You can use these tools to specify headers and footers as shown in the following images:

    -

    - +

    + - Page headers in a Word document. +
    Page headers in a Word document.
    -

    -

    - +

    +
    + - Page footers in a Word document. +
    Page footers in a Word document.
    -

    +

    When converted to PDF, the page headers and footers appear in the document.

    -

    - +

    + - Page headers converted from Word. +
    Page headers converted from Word.
    -

    -

    - +

    +
    + - Page footers converted from Word. +
    Page footers converted from Word.
    -

    -

    This example is shown in operation in the working example of adding running headers using Word (Word file) and working example of adding running headers using Word (PDF file).

    +
    +

    This example is shown in operation in the working example of adding running headers using Word (Word file) and working example of adding running headers using Word (PDF file).

    @@ -84,27 +84,27 @@

    Adding running headers and footers using OpenOffice.org

    In OpenOffice.org Writer, use the Insert > Header and Insert > Footer tools, which allow you to specify header and footer information and layout, as shown in the following images.

    -

    - +

    + - Header and Footer tools in OpenOffice.org Writer. +
    Header and Footer tools in OpenOffice.org Writer.
    -

    -

    - +

    +
    + - Page headers in an OpenOffice.org Writer document. +
    Page headers in an OpenOffice.org Writer document.
    -

    -

    - +

    +
    + - Page footers in an OpenOffice.org Writer document. +
    Page footers in an OpenOffice.org Writer document.
    -

    +

    When converted to PDF, the page headers and footers appear in the document as they do in the converted Word document in Example 1.

    -

    This example is shown in operation in the working example of adding running headers using OpenOffice Writer (OpenOffice file) and working example of adding running headers using OpenOffice Writer (PDF file).

    +

    This example is shown in operation in the working example of adding running headers using OpenOffice Writer (OpenOffice file) and working example of adding running headers using OpenOffice Writer (PDF file).

    @@ -121,12 +121,12 @@

    Adding running headers and footers to PDF documents using as you want them for your document.

    The image below shows Acrobat Pro's Add Header and Footer tool.

    -

    - +

    + - Add Header and Footer tool in Adobe Acrobat Pro +
    Add Header and Footer tool in Adobe Acrobat Pro
    -

    +

    diff --git a/techniques/pdf/PDF15.html b/techniques/pdf/PDF15.html index 0296939eda..4ccdc2d06c 100644 --- a/techniques/pdf/PDF15.html +++ b/techniques/pdf/PDF15.html @@ -40,20 +40,20 @@

    Adding a submit button using Adobe Acrobat 9 Pro

    The following image shows the Options tab on the Button Properties dialog.

    -

    - +

    + - The Options tab in the Button Properties dialog, showing the layout and label button properties. +
    The Options tab in the Button Properties dialog, showing the layout and label button properties.
    -

    +

    The following image shows the Actions tab on the Button Properties dialog.

    -

    - +

    + - The Action tab in the Button Properties dialog with the Select Action option specified. +
    The Action tab in the Button Properties dialog with the Select Action option specified.
    -

    +
    @@ -69,20 +69,20 @@

    Adding a submit button using Adobe LiveCycle Designer

    The following image shows the Standard menu with the list of form controls.

    -

    - +

    + - The Standard menu showing the list of form controls, including the selection of the HTTP Submit Button. +
    The Standard menu showing the list of form controls, including the selection of the HTTP Submit Button.
    -

    +

    The following image shows the Object panel with the URL and other fields for button appearance.

    -

    - +

    + - The Object panel showing the URL and other fields for specifying the submit button's appearance and action. +
    The Object panel showing the URL and other fields for specifying the submit button's appearance and action.
    -

    +

    @@ -106,19 +106,19 @@

    Adding a script action to a submit button in a PDF document });

    The following images illustrate this process:

    -

    - +

    + - The Button Properties dialog for a submit button. +
    The Button Properties dialog for a submit button.
    -

    -

    - +

    +
    + - The JavaScript added to the Action tab of the Button Properties dialog. +
    The JavaScript added to the Action tab of the Button Properties dialog.
    -

    -

    This example is shown in operation in the working example of adding a script action to a submit button.

    +
    +

    This example is shown in operation in the working example of adding a script action to a submit button.

    Tests

    diff --git a/techniques/pdf/PDF16.html b/techniques/pdf/PDF16.html index 0ffb38bcc0..a7dcb4fd24 100644 --- a/techniques/pdf/PDF16.html +++ b/techniques/pdf/PDF16.html @@ -25,18 +25,18 @@

    Adding a /Lang entry to specify the default document language
  • In the "Reading Options" field, select the default language from the "Language" combo box
    • -

    - +

    + - Specifying the default language in Adobe Acrobat's Properties dialog. +
    Specifying the default language in Adobe Acrobat's Properties dialog.
    -

    +

    Acrobat includes 16 preset language selections. If you need to specify a language that is not on the list, such as Russian, you must type the ISO 639 code for the language, not its name.

    -

    This example is shown in operation in the working example of adding a /Lang entry using Acrobat Pro.

    +

    This example is shown in operation in the working example of adding a /Lang entry using Acrobat Pro.

    diff --git a/techniques/pdf/PDF17.html b/techniques/pdf/PDF17.html index abaa32d67d..8a430b37b1 100644 --- a/techniques/pdf/PDF17.html +++ b/techniques/pdf/PDF17.html @@ -5,12 +5,12 @@

    Many documents use specific page number formats within a document. Commonly, front matter is numbered with lowercase Roman numerals. The main content, starting on the page numbered 1, may actually be the fifth or sixth page in the document. Similarly, appendices may begin with page number 1 plus a prefix of the appendix letter (e.g., "A-1").

    Authors should make sure that the page numbering of their converted documents is reflected in any page number displays in their user agent. Consistency in presenting the document's page numbers will help make navigating the document more predictable and understandable.

    As an example, if /PageLabels has not been provided to describe the page number formatting, the page numbering scheme will not be reflected in the Page Navigation toolbar in Adobe Acrobat Pro or Reader. This toolbar displays the page number in a text box, which users can change to move to another page. In addition, users can select the arrows to move one page up or down in the document. The toolbar also displays the relative page number location. In the image below, the default display indicates the user is on page 1 of 4 pages.

    -

    - +

    + - Page Navigation toolbar in Adobe Acrobat Pro, displaying the page number in a text box, which users can change to move to another page. In addition, users can select the arrows to move one page up or down in the document. The toolbar also displays the relative page number location, e.g., page 1 of 4 pages. +
    Page Navigation toolbar in Adobe Acrobat Pro, displaying the page number in a text box, which users can change to move to another page. In addition, users can select the arrows to move one page up or down in the document. The toolbar also displays the relative page number location, e.g., page 1 of 4 pages.
    -

    +

    A more direct way of going to a page is to use the shortcut for the View > Page Navigation > Page menu item. On Windows, this shortcut is "Ctrl + Shift + N"; on Mac OS, it is "Cmd + Shift + N". This brings up a dialog box to go to a specific page number.

    Examples

    @@ -26,22 +26,22 @@

    Editing PDF page number formatting specifications using Adobe Acrobat 9 Pro<

    In this document, a new section has been created with page numbering beginning with Arabic numeral 1 on the fourth page of the document. The document was then converted to PDF from Word.

    -

    - +

    + - The Page Number Format dialog in Word, specifying lowercase Roman page numbering. +
    The Page Number Format dialog in Word, specifying lowercase Roman page numbering.
    -

    +

    In Adobe Acrobat Pro, Select View > Navigation Panels > Pages. The following image shows the page thumbnails in the Pages panel and the Page Navigation toolbar. Both the thumbnails and the toolbar use Arabic page numbers.

    -

    - +

    + - Page thumbnails in the Pages panel and the Page Navigation toolbar, both using Arabic page numbers. +
    Page thumbnails in the Pages panel and the Page Navigation toolbar, both using Arabic page numbers.
    -

    +

    To correct the page numbers:

    1. Select the pages to be renumbered
      2. @@ -53,25 +53,25 @@

      Editing PDF page number formatting specifications using Adobe Acrobat 9 Pro<
    2. Select OK

    The following image shows the Page Numbering dialog and selections.

    -

    - +

    + - Three pages selected on the Pages panel and the Page Numbering dialog specifying the new page styles. The starting page is specified as 1 (default), which is correct. +
    Three pages selected on the Pages panel and the Page Numbering dialog specifying the new page styles. The starting page is specified as 1 (default), which is correct.
    -

    +

    Follow the same process to change the fourth page number to Arabic numeral 1.

    The following image shows the correct page numbers for the 4 pages. Note that page iii is selected in the Pages panel and the Page Navigation toolbar shows iii in the text area. In addition, the relative location in the document is shown at the right of the toolbar: "(3 of 4)."

    -

    - +

    + - The Pages panel in Adobe Acrobat Pro showing pages numbered i, ii, iii, 1. The Page Navigation toolbar shows iii for the third page. The relative page location is also displayed as '(3 of 4).' +
    The Pages panel in Adobe Acrobat Pro showing pages numbered i, ii, iii, 1. The Page Navigation toolbar shows iii for the third page. The relative page location is also displayed as '(3 of 4).'
    -

    -

    This example is shown in operation in the working example of specifying page numbers in a document converted from Word (Word file) and working example of specifying page numbers in a document converted from Word (PDF file).

    +
    +

    This example is shown in operation in the working example of specifying page numbers in a document converted from Word (Word file) and working example of specifying page numbers in a document converted from Word (PDF file).

    diff --git a/techniques/pdf/PDF18.html b/techniques/pdf/PDF18.html index a41790c95f..4d0b19facb 100644 --- a/techniques/pdf/PDF18.html +++ b/techniques/pdf/PDF18.html @@ -26,12 +26,12 @@

    Setting the document title in the metadata and specifying including the document information dictionary
  • Modify the Title field to add or change the document's Title entry
    • -

    - +

    + - Viewing the Title field in the Description tab of the Properties dialog. The document title is entered in the field. +
    Viewing the Title field in the Description tab of the Properties dialog. The document title is entered in the field.
    -

    +

    Note that, with Adobe Acrobat installed, you can also enter and read the data properties information from the desktop. Access the file's context menu, choose Properties, and select the PDF tab. Any information @@ -44,20 +44,20 @@

    Setting the document title in the metadata and specifying
  • In the Window Options section, select Document Title in the Show pull-down list.
    • -

    - +

    + - Specifying that the document title be displayed in the title bar. In the Window Options, Show Document Title is selected. +
    Specifying that the document title be displayed in the title bar. In the Window Options, Show Document Title is selected.
    -

    +

    The title is displayed in the title bar, as shown in the image below.

    -

    - +

    + - Image of the Adobe Acrobat Pro title bar with the title of the document displayed. +
    Image of the Adobe Acrobat Pro title bar with the title of the document displayed.
    -

    -

    This example is shown in operation in the working example of displaying document title in the title bar.

    +
    +

    This example is shown in operation in the working example of displaying document title in the title bar.

    diff --git a/techniques/pdf/PDF19.html b/techniques/pdf/PDF19.html index d8c79a73f8..a6114680e5 100644 --- a/techniques/pdf/PDF19.html +++ b/techniques/pdf/PDF19.html @@ -67,13 +67,13 @@

    Adding a /Lang entry to specify the language for a specific text into position between the other two tags, so that the text reads in the proper order. All three tags must also be at the same level beneath their parent tag. Drag them into place if they are not.

    -

    - +

    + - Specifying the language for a word in text using the Show Order Panel of the TouchUp Reading Order tool. +
    Specifying the language for a word in text using the Show Order Panel of the TouchUp Reading Order tool.
    -

    -

    This example is shown in operation in the working example of marking a specific word or phrase in Acrobat Pro.

    +
    +

    This example is shown in operation in the working example of marking a specific word or phrase in Acrobat Pro.

    diff --git a/techniques/pdf/PDF2.html b/techniques/pdf/PDF2.html index 561c3207da..44434078d8 100644 --- a/techniques/pdf/PDF2.html +++ b/techniques/pdf/PDF2.html @@ -18,12 +18,12 @@

    Converting a table of contents created with Microsoft

    1. Create a table of contents at the beginning of the Word document.

      -

      - +

      + - Reference tab on Word ribbon, showing Table of Contents tool. +
      Reference tab on Word ribbon, showing Table of Contents tool.
      -

      +

    2. Use Save as... > Adobe PDF to convert the Word document to @@ -38,12 +38,12 @@

      Converting a table of contents created with Microsoft to the headings in the document.

      In addition, the headings will appear as PDF Bookmarks in the left-hand Navigation pane.

      -

      - +

      + - PDF document showing the Table of Contents and Bookmarks created from the headings in a Word document. +
      PDF document showing the Table of Contents and Bookmarks created from the headings in a Word document.
      -

      +

      If the document provides a glossary and/or index, these sections should have headings that appear in the table of contents (and thus as bookmarks in the Navigation pane). The table of contents also @@ -51,7 +51,7 @@

      Converting a table of contents created with Microsoft

      If this markup has not been done in the authoring tool, Adobe Acrobat Pro can be used to provide the tags. See if you need to modify converted headings or add new ones.

      -

      This example is shown in operation in the working example of creating bookmarks with Word 2007.

      +

      This example is shown in operation in the working example of creating bookmarks with Word 2007.

    @@ -73,17 +73,17 @@

    Converting a table of contents created with OpenOffice.org
  • Use File > Export as PDF... to convert the document to PDF, specifying Tagged PDF in the Options dialog.
    • -

    - +

    + - Image of the Insert Index/Table dialog in OpenOffice.org Writer. +
    Image of the Insert Index/Table dialog in OpenOffice.org Writer.
    -

    +

    The table-of-contents entries in the converted document will be linked to the headings in the document, and will appear as PDF Bookmarks in the left-hand Navigation pane. The OpenOffice.org Table of Contents and Bookmarks look the same as they appeared in Example 1.

    -

    This example is shown in operation in the working example of creating bookmarks with OpenOffice Writer.

    +

    This example is shown in operation in the working example of creating bookmarks with OpenOffice Writer.

    @@ -101,29 +101,29 @@

    Adding bookmarks using Adobe Acrobat 9 Pro after conversion

    specified as tagged bookmarks.

    The image below shows the Bookmarks options menu.

    -

    - +

    + - The Bookmarks options menu. +
    The Bookmarks options menu.
    -

    +

    The next image shows the selection of links in the document for bookmarking.

    -

    - +

    + - The tagged elements that can be used for bookmarking, with 'links' selected. +
    The tagged elements that can be used for bookmarking, with 'links' selected.
    -

    +

    The tagged bookmarks are nested under a new, untitled bookmark. Access the context menu for the new bookmark and select the Rename option to rename the new bookmark, as shown in the following image.

    -

    - +

    + - The bookmarks for the hyperlink in the document. +
    The bookmarks for the hyperlink in the document.
    -

    -

    This example is shown in operation in the working example of creating bookmarks with Acrobat Pro.

    +
    +

    This example is shown in operation in the working example of creating bookmarks with Acrobat Pro.

    diff --git a/techniques/pdf/PDF20.html b/techniques/pdf/PDF20.html index cd5e2f5b7b..cfec0ad303 100644 --- a/techniques/pdf/PDF20.html +++ b/techniques/pdf/PDF20.html @@ -19,12 +19,12 @@

    Repairing table cells using the Table Editor in the TouchUp

    This example uses a table that was marked up correctly when it was created in Microsoft Word. Some table headers span two rows in the header row; one table header spans two columns.

    -

    - +

    + - A correctly marked up table in Word, with complex headers, before conversion to PDF. +
    A correctly marked up table in Word, with complex headers, before conversion to PDF.
    -

    +

    To check the table in the PDF document:

    1. Advanced > Accessibility > TouchUp Reading Order...
      2. @@ -39,24 +39,24 @@

      Repairing table cells using the Table Editor in the TouchUp Order tool. Note that the Results header appears to span two sub-headers and the other headers to the left span the two rows in the Results header.

      -

      - +

      + - Table in the TouchUp Reading Order tool. As in Word, the table Results header appears to span two sub-headers and the other headers to the left span the two rows in the Results header. +
      Table in the TouchUp Reading Order tool. As in Word, the table Results header appears to span two sub-headers and the other headers to the left span the two rows in the Results header.
      -

      +

      The following images shows the example table in the Table Editor. The cells are outlined in red, and the tab for each cell is displayed. Upon conversion, the Results header was incorrectly split and does not span its two sub-headers. The headers to the right were incorrectly split into 2 cells each and do not span the Results headers. In addition, the incorrectly split cells were merged into one cell.

      -

      - +

      + - Example table in the Table Editor, showing table cells and the tag for each cell. The Table Editor shows the Results header was incorrectly split and does not span its two sub-headers; and other headers were also incorrectly split and merged. +
      Example table in the Table Editor, showing table cells and the tag for each cell. The Table Editor shows the Results header was incorrectly split and does not span its two sub-headers; and other headers were also incorrectly split and merged.
      -

      +

      To repair the Results header:

      1. Select the header in the table (it will be outlined in blue when @@ -70,12 +70,12 @@

        Repairing table cells using the Table Editor in the TouchUp The cell you changed should change color to show the new span, as shown in the following image.

      -

      - +

      + - The Table Cells Properties dialog showing the Column Span changed to 2 to repair a mistagged header in this example. +
      The Table Cells Properties dialog showing the Column Span changed to 2 to repair a mistagged header in this example.
      -

      +

      Similarly, to repair the incorrectly split header cells to the left of Results header:

        @@ -88,20 +88,20 @@

        Repairing table cells using the Table Editor in the TouchUp
      1. Press OK. The following image shows the correction being made to the last header cell, with the corrected header cells to its left.

      -

      - +

      + - The Table Cells Properties dialog showing the Row Span changed to 2 to repair a mistagged header in this example. +
      The Table Cells Properties dialog showing the Row Span changed to 2 to repair a mistagged header in this example.
      -

      +

      The following image shows the repaired example table.

      -

      - +

      + - The repaired example table in the Table Editor. It now has the same table structure as the original Word table. +
      The repaired example table in the Table Editor. It now has the same table structure as the original Word table.
      -

      -

      This example is shown in operation in the working example of repairing table structure (Word file) and working example of repairing table structure (PDF file).

      +
      +

      This example is shown in operation in the working example of repairing table structure (Word file) and working example of repairing table structure (PDF file).

    diff --git a/techniques/pdf/PDF21.html b/techniques/pdf/PDF21.html index 4bd76c4c4c..960034e524 100644 --- a/techniques/pdf/PDF21.html +++ b/techniques/pdf/PDF21.html @@ -40,12 +40,12 @@

    Adding lists to Microsoft Word 2007 documents

    the list tools. The third list did not use the list tool (see the ribbon) and the list will not be tagged as list elements when converted to PDF.

    -

    - +

    + - Screenshot showing correctly formatted ordered and unordered lists, and a third section of text formatted to appear as a list, but not using the list formatting tool in Microsoft Word. +
    Screenshot showing correctly formatted ordered and unordered lists, and a third section of text formatted to appear as a list, but not using the list formatting tool in Microsoft Word.
    -

    +
    @@ -59,13 +59,13 @@

    Adding lists to OpenOffice.org Writer 2.2 documents

    the list tools. The third list did not use the list tool (see the toolbar) and the list will not be tagged as list elements when converted to PDF.

    -

    - +

    + - Screenshot showing correctly formatted ordered and unordered lists, and a third section of text formatted to appear as a list, but not using the list formatting tool in OpenOffice.org Writer. +
    Screenshot showing correctly formatted ordered and unordered lists, and a third section of text formatted to appear as a list, but not using the list formatting tool in OpenOffice.org Writer.
    -

    -

    This example is shown in operation in the working example of adding lists to OpenOffice Writer documents.

    +
    +

    This example is shown in operation in the working example of adding lists to OpenOffice Writer documents.

    @@ -81,23 +81,23 @@

    Ensuring that lists are correctly formatted using Adobe

    In the following image, the third list is formatted as text. The list items are separated only by line-breaks. Assistive technology may not be able to render the list intelligibly for users.

    -

    - +

    + - Tags panel showing incorrectly formatted list as text beneath a Text body tag rather than nested under list tags. +
    Tags panel showing incorrectly formatted list as text beneath a Text body tag rather than nested under list tags.
    -

    +

    To repair the list, use the Tags panel to create list tags in the content.

    The following image shows the resulting first list item correctly formatted.

    -

    - +

    + - Tags panel showing first list item correctly nested under list tags. +
    Tags panel showing first list item correctly nested under list tags.
    -

    -

    This example is shown in operation in the working example of ensuring lists are properly formatted in Acrobat Pro.

    +
    +

    This example is shown in operation in the working example of ensuring lists are properly formatted in Acrobat Pro.

    diff --git a/techniques/pdf/PDF22.html b/techniques/pdf/PDF22.html index 722377ad83..42f531fa53 100644 --- a/techniques/pdf/PDF22.html +++ b/techniques/pdf/PDF22.html @@ -29,12 +29,12 @@ what is wrong, and can correct it are key to software usability and accessibility. Meeting this objective helps ensure that all users can complete for-based transactions with ease and confidence.

    - - Labels for required formats in form controls +
    +

    Labels for required formats in form controls

    It is also important that users are aware that an error may occur. You can incorporate this information in labels; for example, "Date (MM/DD/YYYY)." See .

    - +

    Examples

    Providing validation for an input field format using @@ -55,23 +55,23 @@

    Providing validation for an input field format using
  • In the General tab, specify "Date (mm/dd/yyyy)" for the Name and Tooltip for the control.
    • -

    - +

    + - Specifying a required format for an input field format using Adobe Acrobat 9 Pro +
    Specifying a required format for an input field format using Adobe Acrobat 9 Pro
    -

    +

    When a user types a recognized date format, it is converted automatically to the specified format. If the date format or value is not recognized, an error alert appears and provides further information, as shown in the image below.

    -

    - +

    + - Error alert for date with unrecognized format or value. +
    Error alert for date with unrecognized format or value.
    -

    -

    This example is shown in operation in the working example of Required Fields in Acrobat.

    +
    +

    This example is shown in operation in the working example of Required Fields in Acrobat.

    @@ -88,19 +88,19 @@

    Providing validation for an input field format using

    Because this is a date field the Patterns-Date Field dialog appears. Select the pattern or format you want users to enter. Then click OK.

    -

    - +

    + - Using LiveCycle to specify form fields that require pattern validation +
    Using LiveCycle to specify form fields that require pattern validation
    -

    +
  • In the Object palette, use the Validation Pattern Message box to type a warning message. Be sure to include the required pattern. This message appears when a user tries to submit the form using an invalid date format.
    • -

    This example is shown in operation in the working example of Required Fields in LiveCycle Designer.

    +

    This example is shown in operation in the working example of Required Fields in LiveCycle Designer.

    @@ -114,12 +114,12 @@

    Validating a required date format in a PDF form using validate form fields, in this case, a date field. To add this script to the form field, open the Text Field Properties dialog, as shown in Example 1, and select Edit in the Validate tab:

    -

    - +

    + - Text Field Properties dialog, with the Validate tab open to specify JavaScript validation code. +
    Text Field Properties dialog, with the Validate tab open to specify JavaScript validation code.
    -

    + 
    // JavaScript code for date mask format MM/DD/YYYY
 var re = /^[mdy0-9]{2}\/[mdy0-9]{2}\/[mdy0-9]{4}$/
 //Allow blank space in field
diff --git a/techniques/pdf/PDF23.html b/techniques/pdf/PDF23.html
index e78ab2ae6a..cdae468155 100644
--- a/techniques/pdf/PDF23.html
+++ b/techniques/pdf/PDF23.html
@@ -56,21 +56,21 @@ 
    Adding interactive controls to existing forms in PDF
             
    The following image shows the Run Form Field Recognition tool is
     						selected to detect form fields in a document converted to tagged
     						PDF. 
    
-            
    
-               
+            
    
+               
                   
-                  Form fields in a PDF document in Adobe Acrobat Pro. The Advanced > Accessibility menu is selected, showing the Run Form Field Recognition tool.
+                  
    Form fields in a PDF document in Adobe Acrobat Pro. The Advanced > Accessibility menu is selected, showing the Run Form Field Recognition tool.
    
                  
-            
    
+            
    
             
    The following image shows the resulting form fields after the
     						Run Form Recognition tool is run. 
    
-            
    
-               
+            
    
+               
                   
-                  Form fields in a PDF document in Adobe Acrobat Pro after running the Form Field Recognition tool.
+                  
    Form fields in a PDF document in Adobe Acrobat Pro after running the Form Field Recognition tool.
    
                  
-            
    
-            
    This example is shown in operation in the working example of Interactive Controls in Acrobat.
    
+            
    
+            
    This example is shown in operation in the working example of Interactive Controls in Acrobat.

    @@ -87,21 +87,21 @@

    Adding form controls in PDF documents using Adobe Acrobat
  • Open the Add New Field menu on the upper left, and select a form field to add. The image below shows the menu of fields.
    • -

    - +

    + - The Add New Field menu with the list of available form fields. +
    The Add New Field menu with the list of available form fields.
    -

    +

    The following image shows a checkbox added to the form in Example 1.

    -

    - +

    + - A checkbox added to the form using Add or Edit Fields... +
    A checkbox added to the form using Add or Edit Fields...
    -

    -

    This example is shown in operation in the working example of Interactive Controls in LiveCycle Designer.

    +
    +

    This example is shown in operation in the working example of Interactive Controls in LiveCycle Designer.

    @@ -114,12 +114,12 @@

    Editing form controls in PDF documents using Adobe

    To edit fields, select the context menu for the field and select Properties... The properties menu for that form field lets you modify it, as shown in the following image.

    -

    - +

    + - The Text Field Properties dialog to modify a form field. +
    The Text Field Properties dialog to modify a form field.
    -

    +

    The tooltip is not keyboard accessible but will be screen-reader accessible: see .

    @@ -141,48 +141,47 @@

    Creating new interactive forms with Adobe LiveCycle
  • Select the No Existing Form radio button, as shown in the following image.
    • -

    - +

    + - The first dialog in the Form Wizard showing the No Existing Form Button selected. +
    The first dialog in the Form Wizard showing the No Existing Form Button selected.
    -

    +

    Clicking Next invokes LiveCycle Designer and the first page of the New Form Assistant. as shown in the following image.

    -

    - +

    + - LiveCycle Designer and the first page of the New Form Assistant. +
    LiveCycle Designer and the first page of the New Form Assistant.
    -

    +

    When you invoke LiveCycle Designer from the Windows Start menu, the Form Wizard is available from File > New...

    The New Form Assistant creates a blank form. Use the Object Library in the right pane to select form controls.

    -

    - +

    + - A newly created blank form in LiveCycle Designer with the Object Library. +
    A newly created blank form in LiveCycle Designer with the Object Library.
    -

    +

    You can also use LiveCycle Designer to create forms based on commonly used forms templates.

    1. Invoke the Template Assistant wizard from the New pulldown: - LiveCycle Designer: New icon to select form templates. - .
      2. + LiveCycle Designer: New icon to select form templates..
    2. Select Forms and then select an appropriate type of form. Then, you can personalize the form by swapping out placeholder text, graphics, form fields, and properties with custom objects that you provide or define.
    -

    - +

    + - LiveCycle Designer: list of form templates. +
    LiveCycle Designer: list of form templates.
    -

    +

    diff --git a/techniques/pdf/PDF3.html b/techniques/pdf/PDF3.html index 74ac353a75..44fb9d523d 100644 --- a/techniques/pdf/PDF3.html +++ b/techniques/pdf/PDF3.html @@ -44,13 +44,13 @@

    Creating a 2-column document using Microsoft Word 2007

    Multi-column documents created using Word's Page Layout > Columns... tool typically are in the correct reading order when converted to tagged PDF. The image below shows Word's Columns tool.

    -

    - +

    + - The Columns tool in Word. Two is selected to lay out the page in 2 columns. +
    The Columns tool in Word. Two is selected to lay out the page in 2 columns.
    -

    -

    This example is shown in operation in the working example of 2-column document using Word 2007 (Word file) and working example of 2-column document using Word 2007 (PDF file).

    +
    +

    This example is shown in operation in the working example of 2-column document using Word 2007 (Word file) and working example of 2-column document using Word 2007 (PDF file).

    @@ -62,13 +62,13 @@

    Creating a 2-column document using OpenOffice.org Writer

    Multi-column documents created using OpenOffice.org Writer's Format > Columns... tool typically are in the correct reading order when converted to tagged PDF. The image below shows Writer's Columns tool.

    -

    - +

    + - The Columns tool in OpenOffice.org Writer. Two is selected to lay out the page in 2 columns. +
    The Columns tool in OpenOffice.org Writer. Two is selected to lay out the page in 2 columns.
    -

    -

    This example is shown in operation in the working example of 2-column document using OpenOffice Writer (OpenOffice file) and working example of 2-column document using OpenOffice Writer (PDF file).

    +
    +

    This example is shown in operation in the working example of 2-column document using OpenOffice Writer (OpenOffice file) and working example of 2-column document using OpenOffice Writer (PDF file).

    @@ -83,7 +83,7 @@

    Setting the tab order for one or more pages using Adobe
    • Clicking the Pages icon - Pages icon in the upper left of the Adobe Acrobat Pro navigation pane + Pages icon in the upper left of the Adobe Acrobat Pro navigation pane
    • Or selecting View > Navigation Panels > Pages
      • @@ -96,57 +96,58 @@

      Setting the tab order for one or more pages using Adobe
    • If needed, select a tab order option:
      • - - - Option - Description - - - - Use Row Order - - Tabs from the upper left field, moving first left to right - and then down, one table row at a time. - - - - Use Column Order - - Tabs from the upper left field, moving first from top to - bottom and then across from left to right, one table column - at a time. - - - - Use Document Structure - - For tagged documents, moves in the tag order specified by - the authoring application. -
      -

      This is usually the correct reading - order and will be selected by default for tagged documents.

      -
      - - - - - Unspecified - - If the document was created using an earlier version of - Acrobat Pro, the tab order is Unspecified by default. With - this setting, form fields are tabbed through first, followed - by links and then comments ordered by row. This may not be - correct reading order. - - + + + + + + + + + + + + + + + + + + + + + + + +
      Option Description
      + Use Row Order + Tabs from the upper left field, moving first left to right + and then down, one table row at a time.
      + Use Column Order + Tabs from the upper left field, moving first from top to + bottom and then across from left to right, one table column + at a time.
      + Use Document Structure + For tagged documents, moves in the tag order specified by + the authoring application. +

      This is usually the correct reading + order and will be selected by default for tagged documents.

      +
      + Unspecified + If the document was created using an earlier version of + Acrobat Pro, the tab order is Unspecified by default. With + this setting, form fields are tabbed through first, followed + by links and then comments ordered by row. This may not be + correct reading order.
      + -

      - +

      + - Page properties in Adobe Acrobat Professional. The choices are Use Row Order, Use Column Order, Use Document Structure, Unspecified. Use Document Structure is selected. This is also the default. +
      Page properties in Adobe Acrobat Professional. The choices are Use Row Order, Use Column Order, Use Document Structure, Unspecified. Use Document Structure is selected. This is also the default.
      -

      -

      This example is shown in operation in the working example of setting the tab order (Word file) and working example of setting the tab order (PDF file).

      +
      +

      This example is shown in operation in the working example of setting the tab order (Word file) and working example of setting the tab order (PDF file).

    @@ -166,14 +167,14 @@

    Repairing the reading order using the Tags panel in Adobe

    In the following image, the reading order is correct for the text and header. That is, the content elements H1 and H2 have been switched into the correct reading order.

    -

    - +

    + - Image showing the corrected reading order In +
    Image showing the corrected reading order In Adobe Acrobat Pro. The tags H1 and H2 have been switched and are - now in the correct order. + now in the correct order.
    -

    +

    Tests

    diff --git a/techniques/pdf/PDF4.html b/techniques/pdf/PDF4.html index 55dabaa5d0..2c63224531 100644 --- a/techniques/pdf/PDF4.html +++ b/techniques/pdf/PDF4.html @@ -25,13 +25,13 @@

    Marking a background image as an artifact using Adobe to remove the selected image from the tag structure

    The screenshot below illustrates this example.

    -

    - +

    + - screen shot showing use of the TouchUp Reading Order panel to remove an image from the tag tree +
    screen shot showing use of the TouchUp Reading Order panel to remove an image from the tag tree
    -

    -

    This example is shown in operation in the working example of creating a decorative image (Word file) and working example of marking a background image as an artifact (PDF file).

    +
    +

    This example is shown in operation in the working example of creating a decorative image (Word file) and working example of marking a background image as an artifact (PDF file).

    diff --git a/techniques/pdf/PDF5.html b/techniques/pdf/PDF5.html index 5309994a07..440af30b7c 100644 --- a/techniques/pdf/PDF5.html +++ b/techniques/pdf/PDF5.html @@ -29,14 +29,14 @@ what is wrong, and can correct it are keys to software usability and accessibility. Meeting this objective helps ensure that all users can complete transactions with ease and confidence.

    - - Labels for required form controls +
    +

    Labels for required form controls

    It is also important that users are aware that an error may occur. You can incorporate this information in labels; for example, "Date (required)" or the use of a red asterisk to indicate required fields. (Make sure that a legend appears on each form with required fields, e.g., "* = required field".) See .

    - +

    Examples

    Creating a required field in a PDF form using Adobe Acrobat @@ -51,13 +51,13 @@

    Creating a required field in a PDF form using Adobe Acrobat to submit the form while a required field is blank, an error message appears and the empty required form field is highlighted. -

    - +

    + - The Properties dialog for a form field. The Required box is checked. +
    The Properties dialog for a form field. The Required box is checked.
    -

    -

    This example is shown in operation in the working example of creating a required field in Acrobat.

    +
    +

    This example is shown in operation in the working example of creating a required field in Acrobat.

    @@ -78,15 +78,15 @@

    Creating a required field in a PDF form using Adobe LiveCycle is highlighted.

    The image below shows the Adobe LiveCycle Object palette with the required selection.

    -

    - +

    + - Image of Adobe LiveCycle Object palette showing the 'User entered - Required' selection. +
    Image of Adobe LiveCycle Object palette showing the 'User entered - Required' selection.
    -

    +

    You can also add explicit text to the form label to indicate required fields (e.g., "(Required)").

    -

    This example is shown in operation in the working example of creating a required field in LiveCycle Designer.

    +

    This example is shown in operation in the working example of creating a required field in LiveCycle Designer.

    diff --git a/techniques/pdf/PDF6.html b/techniques/pdf/PDF6.html index 022d438a11..a544cba269 100644 --- a/techniques/pdf/PDF6.html +++ b/techniques/pdf/PDF6.html @@ -41,13 +41,13 @@

    Creating tables in Microsoft Word 2007 that have correctly
  • Check "Repeat as header at the top of each page" as shown in the following image.
    • -

    - +

    + - Image of Table properties dialog for the first table row in Word, with the Row tab selected. 'Repeat as header at the top of each page' is checked to ensure that the first row is marked as header cells. +
    Image of Table properties dialog for the first table row in Word, with the Row tab selected. 'Repeat as header at the top of each page' is checked to ensure that the first row is marked as header cells.
    -

    -

    This example is shown in operation in the working example of tagged table headings in Word 2007.

    +
    +

    This example is shown in operation in the working example of tagged table headings in Word 2007.

    Microsoft Word can only mark up cells as column headings, not as row headings. Only the first row can be marked as heading for all table columns. When the table has row headings or a more complex heading structure, this mark-up must be added in a PDF editor such as Acrobat Pro.

    @@ -64,13 +64,13 @@

    Creating tables in OpenOffice.org Writer 2.2 that have
  • Check Repeat Heading and select "1" in the First Rows listbox as shown in the following image.
    • -

    - +

    + - Image of Table dialog in OpenOffice.org Writer with Table Format tab selected. Repeat Heading is checked and 1 is selected in the First Rows listbox to ensure that the first row is marked as header cells. +
    Image of Table dialog in OpenOffice.org Writer with Table Format tab selected. Repeat Heading is checked and 1 is selected in the First Rows listbox to ensure that the first row is marked as header cells.
    -

    -

    This example is shown in operation in the working example of tagged table headings in OpenOffice Writer.

    +
    +

    This example is shown in operation in the working example of tagged table headings in OpenOffice Writer.

    OpenOffice.org Writer can only mark up cells as column headings, not as row headings. Only the first row can be marked as heading for all table columns. When the table has row headings or a more complex heading structure, this mark-up must be added in a PDF editor such as Acrobat Pro.

    @@ -85,12 +85,12 @@

    Modifying table tags using the Tags tab in Adobe Acrobat
    • In the View menu, select Navigation Panel, then select Tags.
    -

    - +

    + - Table in Adobe Acrobat Pro showing the Tags tab opened to display the table tags. All table cells are marked TD. +
    Table in Adobe Acrobat Pro showing the Tags tab opened to display the table tags. All table cells are marked TD.
    -

    +

    Note that in this case, the table headers were not formatted as illustrated in Examples 1 and 2, and are marked as data cells (TD). To change these to TH tags:

    @@ -102,13 +102,13 @@

    Modifying table tags using the Tags tab in Adobe Acrobat to change Table Data Cell to Table Header Cell.
  • Repeat for all the table header cells in the first table row.
    • -

    - +

    + - Table in Adobe Acrobat Pro showing the use of the Tag Properties dialog to change data cells to header cells +
    Table in Adobe Acrobat Pro showing the use of the Tag Properties dialog to change data cells to header cells
    -

    -

    This example is shown in operation in the working example of tagged table headings in Acrobat.

    +
    +

    This example is shown in operation in the working example of tagged table headings in Acrobat.

    diff --git a/techniques/pdf/PDF7.html b/techniques/pdf/PDF7.html index 5117b94bcd..fbf58617ac 100644 --- a/techniques/pdf/PDF7.html +++ b/techniques/pdf/PDF7.html @@ -27,7 +27,7 @@

    Generating actual text rather than images of text using
    1. Scan the document using as high a resolution as possible to improve the OCR performance.
      2. -
    2. Load the scanned document in Acrobat Acrobat Pro. Select Document > OCR +
    3. Load the scanned document in Acrobat Pro. Select Document > OCR Text Recognition > Recognize Text Using OCR...
    4. In the next dialog, select the All Pages radio button under Pages (or Current Page if you are converting only one page), and then select @@ -53,12 +53,12 @@

      Generating actual text rather than images of text using

      The following image shows a scanned one-page document in Adobe Acrobat Pro.

      -

      - +

      + - A scanned page in Acrobat Pro showing soup recipes. +
      A scanned page in Acrobat Pro showing soup recipes.
      -

      +

      The next image shows the converted content after adding tags to the document. It will probably be necessary to use the TouchUp Reading Order tool and the Tags panel to tag the content properly for the intended @@ -66,15 +66,15 @@

      Generating actual text rather than images of text using was tagged in the conversion. The TouchUp Reading Order tool was used to hide the image as a background (decorative) image (see ). The recipe titles were tagged as first level headers.

      -

      - +

      + - A tagged converted page in Acrobat Pro showing soup recipes. The name of each soup is a first level header. The image of the spiral book binding was hidden as a decorative image. +
      A tagged converted page in Acrobat Pro showing soup recipes. The name of each soup is a first level header. The image of the spiral book binding was hidden as a decorative image.
      -

      +

      Note: Acrobat Pro may automatically add tags when the file is run through OCR.

      -

      This example is shown in operation in the working example of generating actual text and the result of performing OCR.

      +

      This example is shown in operation in the working example of generating actual text and the result of performing OCR.

    Tests

    diff --git a/techniques/pdf/PDF8.html b/techniques/pdf/PDF8.html index a1e73af2d4..ad4d67b4ad 100644 --- a/techniques/pdf/PDF8.html +++ b/techniques/pdf/PDF8.html @@ -38,13 +38,13 @@

    Adding an /E entry to an abbreviation using Adobe Acrobat expansion text, followed by the originally selected text.

    The following image illustrates this technique:

    -

    - +

    + - The addition of expansion text to an abbreviation using the Tags panel. The text 'WCAG2.0' has been selected and a Span tag created for it. The expansion text 'Web Content Accessibility Guidelines (WCAG) 2.0' is entered as the expansion of 'WCAG2.0' using the TouchUp Properties dialog +
    The addition of expansion text to an abbreviation using the Tags panel. The text 'WCAG2.0' has been selected and a Span tag created for it. The expansion text 'Web Content Accessibility Guidelines (WCAG) 2.0' is entered as the expansion of 'WCAG2.0' using the TouchUp Properties dialog
    -

    -

    This example is shown in operation in the working example of Providing definitions for Abbreviations (Word document), working example of Providing definitions for Abbreviations (OpenOffice document), and working example of Providing definitions for Abbreviations (PDF document).

    +
    +

    This example is shown in operation in the working example of Providing definitions for Abbreviations (Word document), working example of Providing definitions for Abbreviations (OpenOffice document), and working example of Providing definitions for Abbreviations (PDF document).

    diff --git a/techniques/pdf/PDF9.html b/techniques/pdf/PDF9.html index e295d0e5d3..181e0d6c26 100644 --- a/techniques/pdf/PDF9.html +++ b/techniques/pdf/PDF9.html @@ -25,8 +25,8 @@

    Adding or modifying tagged headings in PDF documents with Adobe Acrobat 9 Pro

    This example is shown with Adobe Acrobat Pro. There are other software tools that perform similar functions. See the list of other software tools in .

    - - Using the Touchup Reading Order tool +
    +

    Using the Touchup Reading Order tool

    One method of adding headings to PDF documents uses the Touchup Reading Order tool:

      @@ -40,12 +40,12 @@

      Adding or modifying tagged headings in PDF documents The Tags panel is open, showing heading text "Cooking techniques" tagged as H1 and "Cooking with oil" tagged as H2. The text "Cooking with butter" should be tagged as H2 but is not.

      -

      - +

      + - PDF document opened in Adobe Acrobat. The Tags panel shows the headings in the tag tree. Text that should be tagged as H2 is incorrectly tagged as a paragraph. +
      PDF document opened in Adobe Acrobat. The Tags panel shows the headings in the tag tree. Text that should be tagged as H2 is incorrectly tagged as a paragraph.
      -

      +

      To correct the H2 heading, use the TouchUp Reading Order panel as follows:

        @@ -57,26 +57,26 @@

        Adding or modifying tagged headings in PDF documents Pro. The TouchUp Reading Order panel is visible. A selection box appears around the text "Cooking with butter," and Heading 2 on the panel is selected.

        -

        - +

        + - PDF document opened in Adobe Acrobat. The TouchUp Reading Order panel is visible; the heading text is selected and Heading 2 on the panel is selected. +
        PDF document opened in Adobe Acrobat. The TouchUp Reading Order panel is visible; the heading text is selected and Heading 2 on the panel is selected.
        -

        +

        Finally, click the Show Order Panel button on the TouchUp Reading Order panel.

        The following image shows the PDF document opened in Adobe Acrobat Pro. The Tags panel is visible, showing that the text "Cooking with butter" is now tagged as H2.

        -

        - +

        + - PDF document opened in Adobe Acrobat. The TouchUp Reading Order panel shows the correctly tagged headings. +
        PDF document opened in Adobe Acrobat. The TouchUp Reading Order panel shows the correctly tagged headings.
        -

        - - - Using the Order and Tags panels +
        +

    +
    +

    Using the Order and Tags panels

    You can also add or change headings as follows:

    1. Bring up the Order panel.
      2. @@ -87,22 +87,22 @@

      Adding or modifying tagged headings in PDF documents

      The following screenshot shows Order panel and the context menu for the text "Cooking with butter." "Tag as heading 2" is selected in the context menu.

      -

      - +

      + - PDF document opened in Adobe Acrobat. The Order panel and context menu show the text to be changed to Heading 2. +
      PDF document opened in Adobe Acrobat. The Order panel and context menu show the text to be changed to Heading 2.
      -

      +

      You can then check that the correct heading is applied by opening the Tags panel, as shown in the following screenshot.

      -

      - +

      + - PDF document opened in Adobe Acrobat. The Tags panel confirms the correct heading tags. +
      PDF document opened in Adobe Acrobat. The Tags panel confirms the correct heading tags.
      -

      -

      This example is shown in operation in the working example of adding tagged headings (Word file) and working example of adding tagged headings (PDF file).

      - +
      +

      This example is shown in operation in the working example of adding tagged headings (Word file) and working example of adding tagged headings (PDF file).

      +

    @@ -113,32 +113,32 @@

    Creating documents in Microsoft Word that have correctly

    Use Styles to create heading formats: Heading 1, Heading 2, Heading 3, etc. Make styles progress in a logical manner; e.g., a Heading 2 should come after a Heading 1.

    - - In Microsoft Word 2003 +
    +

    In Microsoft Word 2003

    • Select the "Format > Styles and Formatting" menu item to reveal the styles and formatting task pane.
    • Use the Heading 1 to Heading 6 styles provided in the "Styles and Formatting" panel.
    -

    - +

    + - Selecting heading styles in Word 2003. +
    Selecting heading styles in Word 2003.
    -

    - - - In Microsoft Word 2007/2010 +
    +
    +
    +

    In Microsoft Word 2007/2010

    Select the Home Ribbon in Word 2007/2010 and select the appropriate heading (Heading 1 to Heading 6) from the Styles group.

    -

    - +

    + - Selecting heading styles in Word 2007/2010. +
    Selecting heading styles in Word 2007/2010.
    -

    - +
    +

    @@ -166,11 +166,11 @@

    Creating documents in OpenOffice.org Writer 2.2 that have

    Marking up headings using /Hn elements

    -

    Headings within PDF documents can be marked up using /Hn elements elements +

    Headings within PDF documents can be marked up using /Hn elements in the structure tree, where n is numeral 1 through 6 (for example /H1, /H2, etc.).

    The following code fragment illustrates code that is typical for using - the /Hn elements elements to mark content. Note that /H1 has been role-mapped to /Head1 in this example. This is typically accomplished + the /Hn elements to mark content. Note that /H1 has been role-mapped to /Head1 in this example. This is typically accomplished by an authoring tool. 

    0 obj% Document catalog
   << /Type /Catalog
diff --git a/techniques/pdf/img/abbr.jpg b/techniques/pdf/img/abbr.jpg
new file mode 100644
index 0000000000..96005ca204
Binary files /dev/null and b/techniques/pdf/img/abbr.jpg differ
diff --git a/techniques/pdf/img/access-palette-dropdown.jpg b/techniques/pdf/img/access-palette-dropdown.jpg
new file mode 100644
index 0000000000..3dc0f1cc63
Binary files /dev/null and b/techniques/pdf/img/access-palette-dropdown.jpg differ
diff --git a/techniques/pdf/img/bookmark1.jpg b/techniques/pdf/img/bookmark1.jpg
new file mode 100644
index 0000000000..cb0c96993c
Binary files /dev/null and b/techniques/pdf/img/bookmark1.jpg differ
diff --git a/techniques/pdf/img/bookmark2.jpg b/techniques/pdf/img/bookmark2.jpg
new file mode 100644
index 0000000000..f306e2d9a0
Binary files /dev/null and b/techniques/pdf/img/bookmark2.jpg differ
diff --git a/techniques/pdf/img/bookmarks.jpg b/techniques/pdf/img/bookmarks.jpg
new file mode 100644
index 0000000000..76b5f0d54b
Binary files /dev/null and b/techniques/pdf/img/bookmarks.jpg differ
diff --git a/techniques/pdf/img/capelink1.jpg b/techniques/pdf/img/capelink1.jpg
new file mode 100644
index 0000000000..b17f830c50
Binary files /dev/null and b/techniques/pdf/img/capelink1.jpg differ
diff --git a/techniques/pdf/img/capelink2.jpg b/techniques/pdf/img/capelink2.jpg
new file mode 100644
index 0000000000..23892f9e70
Binary files /dev/null and b/techniques/pdf/img/capelink2.jpg differ
diff --git a/techniques/pdf/img/capelink3.jpg b/techniques/pdf/img/capelink3.jpg
new file mode 100644
index 0000000000..6bb2afdd3f
Binary files /dev/null and b/techniques/pdf/img/capelink3.jpg differ
diff --git a/techniques/pdf/img/captionposition.jpg b/techniques/pdf/img/captionposition.jpg
new file mode 100644
index 0000000000..7d616ed474
Binary files /dev/null and b/techniques/pdf/img/captionposition.jpg differ
diff --git a/techniques/pdf/img/cooking-headings1.gif b/techniques/pdf/img/cooking-headings1.gif
new file mode 100644
index 0000000000..987e67af5c
Binary files /dev/null and b/techniques/pdf/img/cooking-headings1.gif differ
diff --git a/techniques/pdf/img/cooking-headings2.gif b/techniques/pdf/img/cooking-headings2.gif
new file mode 100644
index 0000000000..0b0a706b68
Binary files /dev/null and b/techniques/pdf/img/cooking-headings2.gif differ
diff --git a/techniques/pdf/img/cooking-headings3.gif b/techniques/pdf/img/cooking-headings3.gif
new file mode 100644
index 0000000000..3de3c6497b
Binary files /dev/null and b/techniques/pdf/img/cooking-headings3.gif differ
diff --git a/techniques/pdf/img/cooking-headings4.gif b/techniques/pdf/img/cooking-headings4.gif
new file mode 100644
index 0000000000..759be62949
Binary files /dev/null and b/techniques/pdf/img/cooking-headings4.gif differ
diff --git a/techniques/pdf/img/cooking-headings5.gif b/techniques/pdf/img/cooking-headings5.gif
new file mode 100644
index 0000000000..781a9b644e
Binary files /dev/null and b/techniques/pdf/img/cooking-headings5.gif differ
diff --git a/techniques/pdf/img/dateerror.jpg b/techniques/pdf/img/dateerror.jpg
new file mode 100644
index 0000000000..50203acc2d
Binary files /dev/null and b/techniques/pdf/img/dateerror.jpg differ
diff --git a/techniques/pdf/img/dateformat.jpg b/techniques/pdf/img/dateformat.jpg
new file mode 100644
index 0000000000..de3ec68cff
Binary files /dev/null and b/techniques/pdf/img/dateformat.jpg differ
diff --git a/techniques/pdf/img/doc-title.jpg b/techniques/pdf/img/doc-title.jpg
new file mode 100644
index 0000000000..d57730592e
Binary files /dev/null and b/techniques/pdf/img/doc-title.jpg differ
diff --git a/techniques/pdf/img/docprop.gif b/techniques/pdf/img/docprop.gif
new file mode 100644
index 0000000000..9e17418ee8
Binary files /dev/null and b/techniques/pdf/img/docprop.gif differ
diff --git a/techniques/pdf/img/footer-oo.jpg b/techniques/pdf/img/footer-oo.jpg
new file mode 100644
index 0000000000..bfd5a12412
Binary files /dev/null and b/techniques/pdf/img/footer-oo.jpg differ
diff --git a/techniques/pdf/img/footer-word.jpg b/techniques/pdf/img/footer-word.jpg
new file mode 100644
index 0000000000..2190027cf2
Binary files /dev/null and b/techniques/pdf/img/footer-word.jpg differ
diff --git a/techniques/pdf/img/form-validation.jpg b/techniques/pdf/img/form-validation.jpg
new file mode 100644
index 0000000000..dbd6e16dab
Binary files /dev/null and b/techniques/pdf/img/form-validation.jpg differ
diff --git a/techniques/pdf/img/form1.jpg b/techniques/pdf/img/form1.jpg
new file mode 100644
index 0000000000..995434c0b9
Binary files /dev/null and b/techniques/pdf/img/form1.jpg differ
diff --git a/techniques/pdf/img/form1a.jpg b/techniques/pdf/img/form1a.jpg
new file mode 100644
index 0000000000..5b45e97793
Binary files /dev/null and b/techniques/pdf/img/form1a.jpg differ
diff --git a/techniques/pdf/img/form1b.jpg b/techniques/pdf/img/form1b.jpg
new file mode 100644
index 0000000000..2ce4c5186b
Binary files /dev/null and b/techniques/pdf/img/form1b.jpg differ
diff --git a/techniques/pdf/img/form1c.jpg b/techniques/pdf/img/form1c.jpg
new file mode 100644
index 0000000000..3ac2a7dfc4
Binary files /dev/null and b/techniques/pdf/img/form1c.jpg differ
diff --git a/techniques/pdf/img/form2.jpg b/techniques/pdf/img/form2.jpg
new file mode 100644
index 0000000000..427e0f428b
Binary files /dev/null and b/techniques/pdf/img/form2.jpg differ
diff --git a/techniques/pdf/img/form2a.jpg b/techniques/pdf/img/form2a.jpg
new file mode 100644
index 0000000000..87d1dff6e0
Binary files /dev/null and b/techniques/pdf/img/form2a.jpg differ
diff --git a/techniques/pdf/img/form4.jpg b/techniques/pdf/img/form4.jpg
new file mode 100644
index 0000000000..087c39b716
Binary files /dev/null and b/techniques/pdf/img/form4.jpg differ
diff --git a/techniques/pdf/img/form5.jpg b/techniques/pdf/img/form5.jpg
new file mode 100644
index 0000000000..c04d818c50
Binary files /dev/null and b/techniques/pdf/img/form5.jpg differ
diff --git a/techniques/pdf/img/formlabeltop.jpg b/techniques/pdf/img/formlabeltop.jpg
new file mode 100644
index 0000000000..9b4120d506
Binary files /dev/null and b/techniques/pdf/img/formlabeltop.jpg differ
diff --git a/techniques/pdf/img/header-oo.jpg b/techniques/pdf/img/header-oo.jpg
new file mode 100644
index 0000000000..a3c35459d1
Binary files /dev/null and b/techniques/pdf/img/header-oo.jpg differ
diff --git a/techniques/pdf/img/header-word.jpg b/techniques/pdf/img/header-word.jpg
new file mode 100644
index 0000000000..68427bab4d
Binary files /dev/null and b/techniques/pdf/img/header-word.jpg differ
diff --git a/techniques/pdf/img/http.gif b/techniques/pdf/img/http.gif
new file mode 100644
index 0000000000..e39fc24028
Binary files /dev/null and b/techniques/pdf/img/http.gif differ
diff --git a/techniques/pdf/img/jscript.jpg b/techniques/pdf/img/jscript.jpg
new file mode 100644
index 0000000000..d8322469a7
Binary files /dev/null and b/techniques/pdf/img/jscript.jpg differ
diff --git a/techniques/pdf/img/language.jpg b/techniques/pdf/img/language.jpg
new file mode 100644
index 0000000000..cb7f6a71f3
Binary files /dev/null and b/techniques/pdf/img/language.jpg differ
diff --git a/techniques/pdf/img/lc-blank.jpg b/techniques/pdf/img/lc-blank.jpg
new file mode 100644
index 0000000000..7ff017db0e
Binary files /dev/null and b/techniques/pdf/img/lc-blank.jpg differ
diff --git a/techniques/pdf/img/lc-new.jpg b/techniques/pdf/img/lc-new.jpg
new file mode 100644
index 0000000000..37dd33bd44
Binary files /dev/null and b/techniques/pdf/img/lc-new.jpg differ
diff --git a/techniques/pdf/img/lc-objlib.jpg b/techniques/pdf/img/lc-objlib.jpg
new file mode 100644
index 0000000000..a2dcb578a7
Binary files /dev/null and b/techniques/pdf/img/lc-objlib.jpg differ
diff --git a/techniques/pdf/img/lc-objpal-b.jpg b/techniques/pdf/img/lc-objpal-b.jpg
new file mode 100644
index 0000000000..b30f15f51e
Binary files /dev/null and b/techniques/pdf/img/lc-objpal-b.jpg differ
diff --git a/techniques/pdf/img/lc-objpal-t.jpg b/techniques/pdf/img/lc-objpal-t.jpg
new file mode 100644
index 0000000000..0c588d539b
Binary files /dev/null and b/techniques/pdf/img/lc-objpal-t.jpg differ
diff --git a/techniques/pdf/img/lc-objpal-v.jpg b/techniques/pdf/img/lc-objpal-v.jpg
new file mode 100644
index 0000000000..5f701af2eb
Binary files /dev/null and b/techniques/pdf/img/lc-objpal-v.jpg differ
diff --git a/techniques/pdf/img/lc-required2.gif b/techniques/pdf/img/lc-required2.gif
new file mode 100644
index 0000000000..213844df3e
Binary files /dev/null and b/techniques/pdf/img/lc-required2.gif differ
diff --git a/techniques/pdf/img/lc-templates.jpg b/techniques/pdf/img/lc-templates.jpg
new file mode 100644
index 0000000000..68d59247e1
Binary files /dev/null and b/techniques/pdf/img/lc-templates.jpg differ
diff --git a/techniques/pdf/img/link-alt1.jpg b/techniques/pdf/img/link-alt1.jpg
new file mode 100644
index 0000000000..b377913df5
Binary files /dev/null and b/techniques/pdf/img/link-alt1.jpg differ
diff --git a/techniques/pdf/img/link-alt2.jpg b/techniques/pdf/img/link-alt2.jpg
new file mode 100644
index 0000000000..11cf621fee
Binary files /dev/null and b/techniques/pdf/img/link-alt2.jpg differ
diff --git a/techniques/pdf/img/link-alt3.jpg b/techniques/pdf/img/link-alt3.jpg
new file mode 100644
index 0000000000..7aacc0610d
Binary files /dev/null and b/techniques/pdf/img/link-alt3.jpg differ
diff --git a/techniques/pdf/img/link-bookmark.jpg b/techniques/pdf/img/link-bookmark.jpg
new file mode 100644
index 0000000000..b59cbd6771
Binary files /dev/null and b/techniques/pdf/img/link-bookmark.jpg differ
diff --git a/techniques/pdf/img/listrepair.jpg b/techniques/pdf/img/listrepair.jpg
new file mode 100644
index 0000000000..1edfebf075
Binary files /dev/null and b/techniques/pdf/img/listrepair.jpg differ
diff --git a/techniques/pdf/img/lists-oo.jpg b/techniques/pdf/img/lists-oo.jpg
new file mode 100644
index 0000000000..52539e90fc
Binary files /dev/null and b/techniques/pdf/img/lists-oo.jpg differ
diff --git a/techniques/pdf/img/lists-word.jpg b/techniques/pdf/img/lists-word.jpg
new file mode 100644
index 0000000000..f5a2caa350
Binary files /dev/null and b/techniques/pdf/img/lists-word.jpg differ
diff --git a/techniques/pdf/img/livecycledatefield.jpg b/techniques/pdf/img/livecycledatefield.jpg
new file mode 100644
index 0000000000..90535c8495
Binary files /dev/null and b/techniques/pdf/img/livecycledatefield.jpg differ
diff --git a/techniques/pdf/img/nrv1.jpg b/techniques/pdf/img/nrv1.jpg
new file mode 100644
index 0000000000..6e84fd35e4
Binary files /dev/null and b/techniques/pdf/img/nrv1.jpg differ
diff --git a/techniques/pdf/img/nrv2.jpg b/techniques/pdf/img/nrv2.jpg
new file mode 100644
index 0000000000..c2346feca7
Binary files /dev/null and b/techniques/pdf/img/nrv2.jpg differ
diff --git a/techniques/pdf/img/ocr1.jpg b/techniques/pdf/img/ocr1.jpg
new file mode 100644
index 0000000000..0ddd611d00
Binary files /dev/null and b/techniques/pdf/img/ocr1.jpg differ
diff --git a/techniques/pdf/img/ocr3.jpg b/techniques/pdf/img/ocr3.jpg
new file mode 100644
index 0000000000..f9659f6c69
Binary files /dev/null and b/techniques/pdf/img/ocr3.jpg differ
diff --git a/techniques/pdf/img/oo-2col-tool.jpg b/techniques/pdf/img/oo-2col-tool.jpg
new file mode 100644
index 0000000000..c212edef5b
Binary files /dev/null and b/techniques/pdf/img/oo-2col-tool.jpg differ
diff --git a/techniques/pdf/img/oo-toc.jpg b/techniques/pdf/img/oo-toc.jpg
new file mode 100644
index 0000000000..cb5127af37
Binary files /dev/null and b/techniques/pdf/img/oo-toc.jpg differ
diff --git a/techniques/pdf/img/ooalt.jpg b/techniques/pdf/img/ooalt.jpg
new file mode 100644
index 0000000000..56c4d7c99d
Binary files /dev/null and b/techniques/pdf/img/ooalt.jpg differ
diff --git a/techniques/pdf/img/ooheaderfootertools.jpg b/techniques/pdf/img/ooheaderfootertools.jpg
new file mode 100644
index 0000000000..da1d7e2f5b
Binary files /dev/null and b/techniques/pdf/img/ooheaderfootertools.jpg differ
diff --git a/techniques/pdf/img/openofficecooking.jpg b/techniques/pdf/img/openofficecooking.jpg
new file mode 100644
index 0000000000..2b04a9770b
Binary files /dev/null and b/techniques/pdf/img/openofficecooking.jpg differ
diff --git a/techniques/pdf/img/openofficetableheads.jpg b/techniques/pdf/img/openofficetableheads.jpg
new file mode 100644
index 0000000000..63e6ae9bbd
Binary files /dev/null and b/techniques/pdf/img/openofficetableheads.jpg differ
diff --git a/techniques/pdf/img/page-props.jpg b/techniques/pdf/img/page-props.jpg
new file mode 100644
index 0000000000..d73078c701
Binary files /dev/null and b/techniques/pdf/img/page-props.jpg differ
diff --git a/techniques/pdf/img/page_nos-nav.jpg b/techniques/pdf/img/page_nos-nav.jpg
new file mode 100644
index 0000000000..7da6a5df59
Binary files /dev/null and b/techniques/pdf/img/page_nos-nav.jpg differ
diff --git a/techniques/pdf/img/page_nos1.jpg b/techniques/pdf/img/page_nos1.jpg
new file mode 100644
index 0000000000..0ac6fe3d4d
Binary files /dev/null and b/techniques/pdf/img/page_nos1.jpg differ
diff --git a/techniques/pdf/img/page_nos2.jpg b/techniques/pdf/img/page_nos2.jpg
new file mode 100644
index 0000000000..7707dc7bcf
Binary files /dev/null and b/techniques/pdf/img/page_nos2.jpg differ
diff --git a/techniques/pdf/img/page_nos3.jpg b/techniques/pdf/img/page_nos3.jpg
new file mode 100644
index 0000000000..7fc346e36c
Binary files /dev/null and b/techniques/pdf/img/page_nos3.jpg differ
diff --git a/techniques/pdf/img/pages-icon.jpg b/techniques/pdf/img/pages-icon.jpg
new file mode 100644
index 0000000000..742f4d10c0
Binary files /dev/null and b/techniques/pdf/img/pages-icon.jpg differ
diff --git a/techniques/pdf/img/pages_nos_word.jpg b/techniques/pdf/img/pages_nos_word.jpg
new file mode 100644
index 0000000000..aea955c051
Binary files /dev/null and b/techniques/pdf/img/pages_nos_word.jpg differ
diff --git a/techniques/pdf/img/pdf-page-footer.jpg b/techniques/pdf/img/pdf-page-footer.jpg
new file mode 100644
index 0000000000..ecb525bacd
Binary files /dev/null and b/techniques/pdf/img/pdf-page-footer.jpg differ
diff --git a/techniques/pdf/img/pdf-page-header.jpg b/techniques/pdf/img/pdf-page-header.jpg
new file mode 100644
index 0000000000..225823e7f6
Binary files /dev/null and b/techniques/pdf/img/pdf-page-header.jpg differ
diff --git a/techniques/pdf/img/pro-header-footer-tool.jpg b/techniques/pdf/img/pro-header-footer-tool.jpg
new file mode 100644
index 0000000000..50e8494490
Binary files /dev/null and b/techniques/pdf/img/pro-header-footer-tool.jpg differ
diff --git a/techniques/pdf/img/radiobuttongroup.jpg b/techniques/pdf/img/radiobuttongroup.jpg
new file mode 100644
index 0000000000..27d5c84746
Binary files /dev/null and b/techniques/pdf/img/radiobuttongroup.jpg differ
diff --git a/techniques/pdf/img/submit-button.jpg b/techniques/pdf/img/submit-button.jpg
new file mode 100644
index 0000000000..396e659f25
Binary files /dev/null and b/techniques/pdf/img/submit-button.jpg differ
diff --git a/techniques/pdf/img/submit-button1.jpg b/techniques/pdf/img/submit-button1.jpg
new file mode 100644
index 0000000000..9bacc01f21
Binary files /dev/null and b/techniques/pdf/img/submit-button1.jpg differ
diff --git a/techniques/pdf/img/submit-button2.jpg b/techniques/pdf/img/submit-button2.jpg
new file mode 100644
index 0000000000..3250c0a371
Binary files /dev/null and b/techniques/pdf/img/submit-button2.jpg differ
diff --git a/techniques/pdf/img/submit-button3.jpg b/techniques/pdf/img/submit-button3.jpg
new file mode 100644
index 0000000000..c909d081a2
Binary files /dev/null and b/techniques/pdf/img/submit-button3.jpg differ
diff --git a/techniques/pdf/img/submit-panel.gif b/techniques/pdf/img/submit-panel.gif
new file mode 100644
index 0000000000..b6c2e41302
Binary files /dev/null and b/techniques/pdf/img/submit-panel.gif differ
diff --git a/techniques/pdf/img/tab-order.jpg b/techniques/pdf/img/tab-order.jpg
new file mode 100644
index 0000000000..2d523dc1dc
Binary files /dev/null and b/techniques/pdf/img/tab-order.jpg differ
diff --git a/techniques/pdf/img/table-1.jpg b/techniques/pdf/img/table-1.jpg
new file mode 100644
index 0000000000..6c031ef242
Binary files /dev/null and b/techniques/pdf/img/table-1.jpg differ
diff --git a/techniques/pdf/img/table-2.jpg b/techniques/pdf/img/table-2.jpg
new file mode 100644
index 0000000000..eb3f24343e
Binary files /dev/null and b/techniques/pdf/img/table-2.jpg differ
diff --git a/techniques/pdf/img/table-2a.jpg b/techniques/pdf/img/table-2a.jpg
new file mode 100644
index 0000000000..fb6af1ce45
Binary files /dev/null and b/techniques/pdf/img/table-2a.jpg differ
diff --git a/techniques/pdf/img/table-2b.jpg b/techniques/pdf/img/table-2b.jpg
new file mode 100644
index 0000000000..347be1debe
Binary files /dev/null and b/techniques/pdf/img/table-2b.jpg differ
diff --git a/techniques/pdf/img/table-3a.jpg b/techniques/pdf/img/table-3a.jpg
new file mode 100644
index 0000000000..3bfda0ac6d
Binary files /dev/null and b/techniques/pdf/img/table-3a.jpg differ
diff --git a/techniques/pdf/img/table-example.jpg b/techniques/pdf/img/table-example.jpg
new file mode 100644
index 0000000000..cad66f6c16
Binary files /dev/null and b/techniques/pdf/img/table-example.jpg differ
diff --git a/techniques/pdf/img/table-example2.jpg b/techniques/pdf/img/table-example2.jpg
new file mode 100644
index 0000000000..f0b83d225d
Binary files /dev/null and b/techniques/pdf/img/table-example2.jpg differ
diff --git a/techniques/pdf/img/table-word.jpg b/techniques/pdf/img/table-word.jpg
new file mode 100644
index 0000000000..086bfa47bf
Binary files /dev/null and b/techniques/pdf/img/table-word.jpg differ
diff --git a/techniques/pdf/img/textalt1.gif b/techniques/pdf/img/textalt1.gif
new file mode 100644
index 0000000000..6979877f55
Binary files /dev/null and b/techniques/pdf/img/textalt1.gif differ
diff --git a/techniques/pdf/img/textalt2.gif b/techniques/pdf/img/textalt2.gif
new file mode 100644
index 0000000000..5bffe948c8
Binary files /dev/null and b/techniques/pdf/img/textalt2.gif differ
diff --git a/techniques/pdf/img/textalt3.gif b/techniques/pdf/img/textalt3.gif
new file mode 100644
index 0000000000..5b35d1ea39
Binary files /dev/null and b/techniques/pdf/img/textalt3.gif differ
diff --git a/techniques/pdf/img/textalt4.gif b/techniques/pdf/img/textalt4.gif
new file mode 100644
index 0000000000..927f6bc2db
Binary files /dev/null and b/techniques/pdf/img/textalt4.gif differ
diff --git a/techniques/pdf/img/title-bar.jpg b/techniques/pdf/img/title-bar.jpg
new file mode 100644
index 0000000000..fb41f3ae40
Binary files /dev/null and b/techniques/pdf/img/title-bar.jpg differ
diff --git a/techniques/pdf/img/title-entry.jpg b/techniques/pdf/img/title-entry.jpg
new file mode 100644
index 0000000000..690deca158
Binary files /dev/null and b/techniques/pdf/img/title-entry.jpg differ
diff --git a/techniques/pdf/img/turo_background.gif b/techniques/pdf/img/turo_background.gif
new file mode 100644
index 0000000000..41786aedbe
Binary files /dev/null and b/techniques/pdf/img/turo_background.gif differ
diff --git a/techniques/pdf/img/unformattedlist.jpg b/techniques/pdf/img/unformattedlist.jpg
new file mode 100644
index 0000000000..76546628e1
Binary files /dev/null and b/techniques/pdf/img/unformattedlist.jpg differ
diff --git a/techniques/pdf/img/word-col-tool.jpg b/techniques/pdf/img/word-col-tool.jpg
new file mode 100644
index 0000000000..7db12d6b90
Binary files /dev/null and b/techniques/pdf/img/word-col-tool.jpg differ
diff --git a/techniques/pdf/img/word-headerfootertools.jpg b/techniques/pdf/img/word-headerfootertools.jpg
new file mode 100644
index 0000000000..87f9405bd6
Binary files /dev/null and b/techniques/pdf/img/word-headerfootertools.jpg differ
diff --git a/techniques/pdf/img/word-table.jpg b/techniques/pdf/img/word-table.jpg
new file mode 100644
index 0000000000..8f873ae419
Binary files /dev/null and b/techniques/pdf/img/word-table.jpg differ
diff --git a/techniques/pdf/img/word-toc.jpg b/techniques/pdf/img/word-toc.jpg
new file mode 100644
index 0000000000..896cddd7e1
Binary files /dev/null and b/techniques/pdf/img/word-toc.jpg differ
diff --git a/techniques/pdf/img/word2003.gif b/techniques/pdf/img/word2003.gif
new file mode 100644
index 0000000000..e828f78d56
Binary files /dev/null and b/techniques/pdf/img/word2003.gif differ
diff --git a/techniques/pdf/img/word2003alt.gif b/techniques/pdf/img/word2003alt.gif
new file mode 100644
index 0000000000..6658dcf123
Binary files /dev/null and b/techniques/pdf/img/word2003alt.gif differ
diff --git a/techniques/pdf/img/word2007.gif b/techniques/pdf/img/word2007.gif
new file mode 100644
index 0000000000..df62df1fa5
Binary files /dev/null and b/techniques/pdf/img/word2007.gif differ
diff --git a/techniques/pdf/img/word2007alt.gif b/techniques/pdf/img/word2007alt.gif
new file mode 100644
index 0000000000..79d0489694
Binary files /dev/null and b/techniques/pdf/img/word2007alt.gif differ
diff --git a/techniques/server-side-script/SVR3.html b/techniques/server-side-script/SVR3.html
index a9f4a7a747..4561c8e157 100644
--- a/techniques/server-side-script/SVR3.html
+++ b/techniques/server-side-script/SVR3.html
@@ -65,7 +65,7 @@ 
    Using Http referer in PHP
    
 ?>
    -

    A working example, Conforming content, is available.

    +

    A working example, Conforming content, is available.

    Tests

    diff --git a/techniques/silverlight/SL1.html b/techniques/silverlight/SL1.html index 01df883e72..e3256fa149 100644 --- a/techniques/silverlight/SL1.html +++ b/techniques/silverlight/SL1.html @@ -20,8 +20,8 @@ on user preference at run time.

    The media formats that are supported by Silverlight are documented on MSDN.

    - - Media encoding +
    +

    Media encoding

    The process of encoding the media with additional audio channels is not described in this technique because configuring and encoding audio channels for media formats is a technique for any usage of media in @@ -37,7 +37,7 @@ alternate audio. Other tracks might exist in the encoded media that provide language translations of the default audio, or that serve other purposes.

    - +

    Examples

    Changing AudioStreamIndex

    @@ -107,7 +107,7 @@

    Changing AudioStreamIndex

    { media.Play(); } -

    This example is shown in operation in the working example of Alternative Audio Channel. If using the test file, the test contains test audio tones rather than actual audio description, but the pitch of the tones is indicative of which of the channels is selected and played.

    +

    This example is shown in operation in the working example of Alternative Audio Channel. If using the test file, the test contains test audio tones rather than actual audio description, but the pitch of the tones is indicative of which of the channels is selected and played.

    Tests

    diff --git a/techniques/silverlight/SL10.html b/techniques/silverlight/SL10.html index 841bba671c..a3b443f834 100644 --- a/techniques/silverlight/SL10.html +++ b/techniques/silverlight/SL10.html @@ -20,8 +20,8 @@ is called on each of these bindings. The application-specific Submit button is connected to an event handler that calls UpdateSource on all of the databound UI elements that comprise that form.

    - - Validation of data +
    +

    Validation of data

    The Submit button itself can also be the UI element that provides warnings, instructions, etc. in a way that assistive technologies can report to users, through the AutomationProperties techniques. @@ -29,7 +29,7 @@ relies on a particular data binding mode. The Submit model can be used either along with client-side or server-side validation techniques. The example does not explicitly include either validation technique.

    - +

    Examples

    Two form fields with Submit

    @@ -105,7 +105,7 @@

    Two form fields with Submit

    LayoutRoot.Children.Add(tb); } -

    This example is shown in operation in the working example of Basic Submit Button.

    +

    This example is shown in operation in the working example of Basic Submit Button.

    Tests

    diff --git a/techniques/silverlight/SL11.html b/techniques/silverlight/SL11.html index af19fb4c49..13446f30c0 100644 --- a/techniques/silverlight/SL11.html +++ b/techniques/silverlight/SL11.html @@ -14,8 +14,8 @@ be animated are quite broad. The general technique shown can be used to pause or stop any Silverlight animation, including those that are purely decorative.

    - - Pause versus Stop +
    +

    Pause versus Stop

    Silverlight has two discrete methods for animation control: a Pause method and a Stop method. The difference in behavior is that Pause uses whatever the last value was while the animation was still running, @@ -32,7 +32,7 @@ to use Stop, authors can simply replace the call to .Pause() with a call to .Stop() for any code that is based on this technique's example.

    - +

    Examples

    Pausing a decorative animation

    @@ -84,7 +84,7 @@

    Pausing a decorative animation

    (this.Resources["anim"] as Storyboard).Pause(); } -

    This example is shown in operation in the working example of Pause Bouncy Ball.

    +

    This example is shown in operation in the working example of Pause Bouncy Ball.

    Tests

    diff --git a/techniques/silverlight/SL13.html b/techniques/silverlight/SL13.html index 358697103a..cb51b0043d 100644 --- a/techniques/silverlight/SL13.html +++ b/techniques/silverlight/SL13.html @@ -24,8 +24,8 @@ (such as a button or text link) to the user, so that the user can engage high contrast for a Silverlight application's content by activating a control within the Silverlight application.

    - - Silverlight Toolkit themes and System Colors +
    +

    Silverlight Toolkit themes and System Colors

    An extension to the Silverlight core deliverables known as the Silverlight Toolkit provides theming APIs and various themed styles for Silverlight controls, including the core controls. Most of these themes are intended @@ -45,9 +45,9 @@ site. The themes feature of Silverlight Toolkit is best explained by Silverlight Toolkit release notes (from a Microsoft-related blog).

    - - - Real-time changes not supported +
    +
    +

    Real-time changes not supported

    SystemParameters.HighContrast is an adequate trigger for cases where high contrast is already engaged before the Silverlight @@ -57,9 +57,9 @@ If Silverlight authors want to support real-time changes, they should provide a user-initiated control option for changing to high contrast in Silverlight UI rather than solely relying on SystemParameters.HighContrast.

    - - - Silverlight and CSS +
    +
    +

    Silverlight and CSS

    Silverlight content does not use information that comes from a CSS style as applied to the hosting HTML page. Therefore, techniques as implemented by browser user agents and described by G148: @@ -71,7 +71,7 @@ not directly apply. For example, the Internet Explorer settings under Options / Appearance do not affect the fonts or contrast in the Silverlight content area.

    - +

    Examples

    Silverlight application designed with brush resources @@ -185,19 +185,19 @@

    Silverlight application designed with brush resources

    The following images show the original, and the applied high contrast settings.

    -

    - +

    + - Low contrast image with "switch to high contrast" button enabled +
    Low contrast image with "switch to high contrast" button enabled
    -

    -

    - +

    +
    + - High contrast image with "switch to regular theme" button enabled +
    High contrast image with "switch to regular theme" button enabled
    -

    -

    This example is shown in operation in the working example of High Contrast.

    +
    +

    This example is shown in operation in the working example of High Contrast.

    @@ -223,7 +223,8 @@

    Use SystemParameters.HighContrast to detect system high

    Tests

    - UI option for style switching +
    +

    UI option for style switching

    Procedure

    To test a Silverlight UI option for style switching (Example 1):

      @@ -240,8 +241,8 @@

      Use SystemParameters.HighContrast to detect system high

      Expected Results

      #3 is true.

      -

    Tests

    - HighContrast API +
    +

    HighContrast API

    Procedure

    To test the HighContrast API (Example 2):

      @@ -259,8 +260,8 @@

      Use SystemParameters.HighContrast to detect system high

      Expected Results

      #3 is true.

      -

    Tests

    - UI option for enhanced contrast +
    +

    UI option for enhanced contrast

    Procedure

    To test a Silverlight UI option for style switching for enhanced contrast:

      @@ -277,7 +278,7 @@

      Use SystemParameters.HighContrast to detect system high

      Expected Results

      #3 is true.

      -

    Resources

    diff --git a/techniques/silverlight/SL14.html b/techniques/silverlight/SL14.html index 7a3cc15290..d9efa65734 100644 --- a/techniques/silverlight/SL14.html +++ b/techniques/silverlight/SL14.html @@ -30,8 +30,8 @@ often have parallel conventions whereby the user is made aware of which element is visually focused and is the current input scope presented by the assistive technology.

    - - Browser hosts and keyboard events +
    +

    Browser hosts and keyboard events

    Silverlight is hosted as a plug-in inside a browser host. The Silverlight runtime only receives the input events that the browser host forwards to hosted plug-ins through a browser-specific program access layer. @@ -50,9 +50,9 @@ but still are a natural choice for an accelerator. Using the CTRL key as a modifier is a convention that is frequently used in existing Silverlight applications.

    - - - Informing users of which keys to use for keyboard equivalence +
    +
    +

    Informing users of which keys to use for keyboard equivalence

    If a control supports user interaction, which key to use to engage the keyboard equivalent behavior is not always obvious. One way to inform users of the possible key options that a control supports is @@ -66,9 +66,9 @@ menu framework that visually indicates the key associations (perhaps with the Windows key-underlined convention), providing a generalized application Help, or displaying plain text in the user interface.

    - - - The On* method pattern in Silverlight +
    +
    +

    The On* method pattern in Silverlight

    Silverlight classes often have methods that follow the naming pattern On* where the star is a string that also identifies an event. These On* methods are prewired event handlers, defined as virtual methods so that subclasses @@ -79,7 +79,7 @@ of OnGotFocus and OnLostFocus. Controls that introduce new events should consider also exposing a virtual On* method that pairs with the event, so that consumers of the custom control can use the same pattern.

    - +

    Examples

    KeyNumericUpDown Control That Handles Arrow Key Equivalence @@ -232,7 +232,7 @@

    KeyNumericUpDown Control That Handles Arrow Key Equivalence already built-in to all instances of the control. 

    <local:KeysNumericUpDown Width="100" Height="45"/>
    -

    This example is shown in operation in the working example of Numeric Up / Down control.

    +

    This example is shown in operation in the working example of Numeric Up / Down control.

    Tests

    diff --git a/techniques/silverlight/SL15.html b/techniques/silverlight/SL15.html index 6e6e8a97d5..f027c458c8 100644 --- a/techniques/silverlight/SL15.html +++ b/techniques/silverlight/SL15.html @@ -60,12 +60,12 @@ be a new text element that enumerates the possible keys. For example, the application could display a Silverlight Popup with the following content:

    -

    - +

    + - A screen shot of a sample Popup control that documents specific accelerator keys +
    A screen shot of a sample Popup control that documents specific accelerator keys
    -

    +

    Examples

    Key handling by application root UserControl

    @@ -178,7 +178,7 @@

    Key handling by application root UserControl

    p.IsOpen = false; } -

    This example is shown in operation in the working example of Application Level Key Handling.

    +

    This example is shown in operation in the working example of Application Level Key Handling.

    Tests

    diff --git a/techniques/silverlight/SL16.html b/techniques/silverlight/SL16.html index becaa730aa..5e151cec2d 100644 --- a/techniques/silverlight/SL16.html +++ b/techniques/silverlight/SL16.html @@ -26,8 +26,8 @@

    Script-embedded captions are captions that are stored directly in the media file as metadata, rather than as a separate file. For information about techniques for captions in separate files, see .

    - - Tools +
    +

    Tools

    Producing the media file with TimelineMarkers captions directly in embedded scripting can be accomplished using the Microsoft Expression Encoder tool. Online help for the procedure of encoding @@ -42,7 +42,7 @@ and taught in Microsoft's available instructional material on Silverlight. However, because the mechanism is public, it is possible that other tools exist or will exist that can also produce media with script-encoded TimelineMarkers.

    - +

    Examples

    MediaElement handles MarkerReached, displays marker text @@ -79,7 +79,7 @@

    MediaElement handles MarkerReached, displays marker text captionText.SelectedText = e.Marker.Text.ToString() + "\n"; } -

    This example is shown in operation in the working example of Media Timeline Markers.

    +

    This example is shown in operation in the working example of Media Timeline Markers.

    Tests

    diff --git a/techniques/silverlight/SL17.html b/techniques/silverlight/SL17.html index 6e94d05a68..9d6e1a6e15 100644 --- a/techniques/silverlight/SL17.html +++ b/techniques/silverlight/SL17.html @@ -111,7 +111,7 @@

    MediaElement playing audio, replace with transcript

    parent.Children.Add(rtb); } -

    This example is shown in operation in the working example of Replace Audio With Transcript.

    +

    This example is shown in operation in the working example of Replace Audio With Transcript.

    Tests

    diff --git a/techniques/silverlight/SL18.html b/techniques/silverlight/SL18.html index 65c0593759..c9d1147b92 100644 --- a/techniques/silverlight/SL18.html +++ b/techniques/silverlight/SL18.html @@ -55,11 +55,12 @@

    Applying a text alternative for an icon Button with <Image Height="12" Width="12" Source="/icon_pause.png"/> </Button> -

    This example is shown in operation in the working example of Button Text Alternative.

    +

    This example is shown in operation in the working example of Button Text Alternative.

    Tests

    - Accessibility framework view +
    +

    Accessibility framework view

    Procedure

    1. Using a browser that supports Silverlight, open an HTML page that @@ -74,8 +75,8 @@

      Applying a text alternative for an icon Button with

      Expected Results

      #2 is true.

      -

    Tests

    - Screen Reader +
    +

    Screen Reader

    Procedure

    1. Using a browser that supports Silverlight, open an HTML page that @@ -91,7 +92,7 @@

      Applying a text alternative for an icon Button with

      Expected Results

      #3 is true.

      -

    Resources

    diff --git a/techniques/silverlight/SL19.html b/techniques/silverlight/SL19.html index 252143d963..1d88e840ff 100644 --- a/techniques/silverlight/SL19.html +++ b/techniques/silverlight/SL19.html @@ -135,7 +135,7 @@

    Using HelpText as form instructions

  • NameTextBoxToolTipString: Must be 10 characters or less. Required.
  • AgeTextBoxToolTipString Must be a value between 0 and 120. Required.
    • -

    These examples are shown in operation in the working example of Automation Properties Help Text and working example of HelpText and ToolTip.

    +

    These examples are shown in operation in the working example of Automation Properties Help Text and working example of HelpText and ToolTip.

    Tests

    diff --git a/techniques/silverlight/SL2.html b/techniques/silverlight/SL2.html index e67afa1e6d..8bd9e282eb 100644 --- a/techniques/silverlight/SL2.html +++ b/techniques/silverlight/SL2.html @@ -44,8 +44,8 @@ associated with keyboard focus to work with. If this is not the case, or if the scenario is that a Silverlight author is defining their own control, a different technique is needed. See .

    - - Focus in Silverlight +
    +

    Focus in Silverlight

    Focus in Silverlight is equivalent to the larger user interface and application concept of keyboard focus. The element that has focus is the element within the Silverlight object tree and programming model @@ -68,7 +68,7 @@ behavior, and does not require each application author to call Focus in application code. - +

    Examples

    Two Button elements, one reskinned to provide new visible @@ -143,19 +143,19 @@

    Two Button elements, one reskinned to provide new visible

    The following images show how each of the two buttons (default and reskinned) appear when focused.

    -

    - +

    + - Default button focus +
    Default button focus
    -

    -

    - +

    +
    + - Reskinned button focus +
    Reskinned button focus
    -

    -

    This example is shown in operation in the working example of Visible Focus Template.

    +
    +

    This example is shown in operation in the working example of Visible Focus Template.

    Tests

    diff --git a/techniques/silverlight/SL20.html b/techniques/silverlight/SL20.html index 6146b6b4dd..e74c4889d5 100644 --- a/techniques/silverlight/SL20.html +++ b/techniques/silverlight/SL20.html @@ -58,8 +58,8 @@ simple string, and it may be the application author's responsibility to set AutomationProperties.Name explicitly as an attribute in XAML, or as a property in runtime code. For details, see .

    - - Test-based methodology +
    +

    Test-based methodology

    In order to use this technique effectively, application authors are expected to be following a test-based methodology towards verifying what information their application is reporting to any pertinent accessibility @@ -80,7 +80,7 @@ of the automation peers. At this point, the application author may have to apply additional Silverlight techniques that provide accessibility framework information, for example .

    - +

    Examples

    Button is composed with direct text content only

    @@ -98,13 +98,13 @@

    Button is composed with direct text content only

    or AutomationProperties.Name has been applied to that button that would otherwise have supplied an acccessibility framework "Name".

    -

    - +

    + - UIAVerify tree view +
    UIAVerify tree view
    -

    -

    This example is shown in operation in the working example of Simple Peer Forwarding.

    +
    +

    This example is shown in operation in the working example of Simple Peer Forwarding.

    Tests

    diff --git a/techniques/silverlight/SL21.html b/techniques/silverlight/SL21.html index d58475066d..1e09f812dc 100644 --- a/techniques/silverlight/SL21.html +++ b/techniques/silverlight/SL21.html @@ -85,7 +85,7 @@

    Stopping an animation that is scrolling text, replacing the animation with a LayoutRoot.Children.Add(tb); } -

    This example is shown in operation in the working example of Stop Text Animation.

    +

    This example is shown in operation in the working example of Stop Text Animation.

    Tests

    diff --git a/techniques/silverlight/SL22.html b/techniques/silverlight/SL22.html index 5f650f5e8d..d5cab6a3d8 100644 --- a/techniques/silverlight/SL22.html +++ b/techniques/silverlight/SL22.html @@ -20,8 +20,8 @@ it is likely to be the zoom /scaling feature enabled by the browser host that Web technology users are the most familiar with as a technique for increasing the text size in Web content.

    - - Legacy behavior in Silverlight version 2 +
    +

    Legacy behavior in Silverlight version 2

    Built-in support for browser zoom was introduced as a feature in Silverlight version 3. Older documents on the Web might describe techniques that were relevant for Silverlight version 2, where dealing with browser @@ -31,9 +31,9 @@ detects existing handlers that might still use the older techniques. Built-in zoom not active in these cases, so that applications can avoid doubling or otherwise mishandling the user agent's zooming behavior.

    - - - Deliberately disabling browser zoom in Silverlight applications +
    +
    +

    Deliberately disabling browser zoom in Silverlight applications

    Silverlight also provides the ability to disable the built-in browser zoom handling and rendering behavior. This is sometimes done in order to suppress some of the aliasing and distortion artifacts that host-level @@ -44,7 +44,7 @@ zoom behavior and rendering for Silverlight content, the browser still retains its zoom settings, and that setting applies to other content outside of Silverlight such as the hosting HTML.

    - +

    Examples

    Verifying browser zoom, and checking the zoom factor

    @@ -93,7 +93,7 @@

    Verifying browser zoom, and checking the zoom factor

    } } -

    This example is shown in operation in the working example of Browser Zoom.

    +

    This example is shown in operation in the working example of Browser Zoom.

    Tests

    diff --git a/techniques/silverlight/SL23.html b/techniques/silverlight/SL23.html index 7fe4996219..ebfd676b2e 100644 --- a/techniques/silverlight/SL23.html +++ b/techniques/silverlight/SL23.html @@ -33,8 +33,8 @@ are most often written in code (there are related techniques that can react to states with event associations, defined in pure XAML, but the specific style switching technique is most straightforward in code).

    - - Using this technique versus relying on browser zoom +
    +

    Using this technique versus relying on browser zoom

    Silverlight supports browser zoom when viewed in browser hosts that support a browser zoom feature. Specifically, Silverlight scales content within its content area when the user engages browser zoom, based on @@ -50,9 +50,9 @@ presents a UI and logic for sizing the fonts using the Silverlight API, as described in this technique.

    For more information about Silverlight and browser zoom, see the technique .

    - - - Sizing by percent +
    +
    +

    Sizing by percent

    Generally, sizing Silverlight FontSize values by percentages is not recommended. Sizing by percentage produces non-integer font size values, which in turn produce aliasing artifacts. The Silverlight @@ -62,9 +62,9 @@ shaping and subpixel rendering for text areas, and this behavior is based on the assumption that font unit measurements will be provided by applications using whole pixel values.

    - - - Units for font sizing in Silverlight +
    +
    +

    Units for font sizing in Silverlight

    Font sizing in Silverlight is always specified by a unit measure of pixels. Other unit measures such as ems or points that come from a migrated UI definition in XAML would need to be unit-converted to all @@ -74,7 +74,7 @@ is porting or migrating a Windows Presentation Framework (WPF) application to Silverlight, or is using a XAML-emitting design tool that is producing general XAML UI definitions and not targeting a specific framework.

    - +

    Examples

    Style applied to all text elements within a RichTextBox @@ -124,19 +124,19 @@

    Style applied to all text elements within a RichTextBox }

    The following images show the original, and the applied style.

    -

    - +

    + - Screen shot with standard fonts and a button to enlarge +
    Screen shot with standard fonts and a button to enlarge
    -

    -

    - +

    +
    + - Screen shot with enlarged fonts after activating button to enlarge +
    Screen shot with enlarged fonts after activating button to enlarge
    -

    -

    This example is shown in operation in the working example of Style Switcher Font Size.

    +
    +

    This example is shown in operation in the working example of Style Switcher Font Size.

    @@ -180,7 +180,7 @@

    Font size increase applied to all text content by applying }

    - This example is shown in operation in the working example of By Animation Font Size. + This example is shown in operation in the working example of By Animation Font Size.

    diff --git a/techniques/silverlight/SL24.html b/techniques/silverlight/SL24.html index 6823c184fb..5e70691b27 100644 --- a/techniques/silverlight/SL24.html +++ b/techniques/silverlight/SL24.html @@ -81,7 +81,7 @@

    Setting AutoPlay to false, and providing the typical MediaElement controls i } -

    This example is shown in operation in the working example of Media Element Controls with AutoPlay False.

    +

    This example is shown in operation in the working example of Media Element Controls with AutoPlay False.

    Tests

    diff --git a/techniques/silverlight/SL25.html b/techniques/silverlight/SL25.html index 8f26b392c4..18c1cb7041 100644 --- a/techniques/silverlight/SL25.html +++ b/techniques/silverlight/SL25.html @@ -22,15 +22,15 @@ interface design. You can also focus a UserControl, for cases where the area to call focus to represents a custom control implementation.

    - - Setting TabIndex (not recommended) +
    +

    Setting TabIndex (not recommended)

    Silverlight provides a TabIndex attribute that can be used to override the default-generated tab sequence. Do not attempt to adjust tab index as a technique for getting past content blocks. Doing so will create a focus order that does not match the apparent visual order, as described in SC 2.4.3.

    - +

    Examples

    User-enabled control that programmatically sets focus

    @@ -52,7 +52,7 @@

    User-enabled control that programmatically sets focus

    rtb_MainContent.Focus(); } -

    This example is shown in operation in the working example of Programmatic Focus.

    +

    This example is shown in operation in the working example of Programmatic Focus.

    Tests

    diff --git a/techniques/silverlight/SL26.html b/techniques/silverlight/SL26.html index 718474669d..332f534883 100644 --- a/techniques/silverlight/SL26.html +++ b/techniques/silverlight/SL26.html @@ -36,7 +36,7 @@

    Two TextBox form fields, each with a LabeledBy reference </StackPanel> </StackPanel> -

    This example is shown in operation in the working example of Labels.

    +

    This example is shown in operation in the working example of Labels.

    diff --git a/techniques/silverlight/SL27.html b/techniques/silverlight/SL27.html index 1f81fc6bcd..b159eb5c31 100644 --- a/techniques/silverlight/SL27.html +++ b/techniques/silverlight/SL27.html @@ -59,8 +59,8 @@ is actively resetting CurrentCulture away from the user settings of platform or user agent. For more information, see . - - HTML Lang +
    +

    HTML Lang

    When Silverlight is embedded in an HTML document with the <object> element, the value of the HTML Lang attribute of the surrounding HTML becomes a factor. Browsers process the outer HTML, and the browser's processing @@ -93,9 +93,9 @@ HTML from within the Silverlight API, by using the DOM-bridging method HtmlElement.GetAttribute. Otherwise, this can be determined by techniques other than Silverlight's (such as scripting to the HTML DOM of the hosting browser).

    - - - Silverlight Language property +
    +
    +

    Silverlight Language property

    Language is an attribute that is available on all Silverlight objects that directly represent a UI element. Language @@ -126,9 +126,9 @@ affect considerations such as: how white space is processed (in particular CR or LF); character sets for fonts; string formatting when using APIs specifically on that part.

    - - - CultureInfo +
    +
    +

    CultureInfo

    CultureInfo is a concept that is relevant to .NET Framework programming. This concept applies to Silverlight because @@ -177,7 +177,7 @@ declare specific language settings for a part (component, region or control) of the Silverlight application, a different Silverlight-specific property Language is used.

    - +

    Examples

    These examples show Silverlight behaviors that are based on interpreting the Language property value, as a way of illustrating @@ -215,7 +215,7 @@

    Language set at root-level of Silverlight content, inherits

    // this will be 'en-gb' because inherits from the root } -

    This example is shown in operation in the working example of Language Properties.

    +

    This example is shown in operation in the working example of Language Properties.

    diff --git a/techniques/silverlight/SL28.html b/techniques/silverlight/SL28.html index 888b762e70..195a9e67af 100644 --- a/techniques/silverlight/SL28.html +++ b/techniques/silverlight/SL28.html @@ -49,8 +49,8 @@ player, in such a way that text and formatting behavior can be retrieved and presented in the Text part of the player UI - - Text Captioning Formats +
    +

    Text Captioning Formats

    There are several existing text-based formats that are used for text captioning of prerecorded media. The following are supported as formats if using the Expression Encoder tool as shown in Example 1 (where the @@ -124,7 +124,7 @@ application UI display, and including it all in the main Silverlight application library. - +

    Examples

    Using Expression Encoder and Expression Blend to produce @@ -233,12 +233,12 @@

    Using Expression Encoder and Expression Blend to produce tabs of an Expression user interface are dockable; the orientations shown here are the default, but could be in different locations on any given computer or configuration.

    -

    - +

    + - Expression Encoder screenshot +
    Expression Encoder screenshot
    -

    +

    diff --git a/techniques/silverlight/SL29.html b/techniques/silverlight/SL29.html index b3ee4fd06e..fbcdd61637 100644 --- a/techniques/silverlight/SL29.html +++ b/techniques/silverlight/SL29.html @@ -129,13 +129,13 @@

    Customize the behavior and appearance of a ListBox to

    The following is an illustration of what such a control might look like:

    -

    - +

    + - Screen shot of a focusable control beyond a list of buttons +
    Screen shot of a focusable control beyond a list of buttons
    -

    -

    This example is shown in operation in the working example of Tab Navigation.

    +
    +

    This example is shown in operation in the working example of Tab Navigation.

    Tests

    diff --git a/techniques/silverlight/SL3.html b/techniques/silverlight/SL3.html index c9a95b512a..e6e6752ebd 100644 --- a/techniques/silverlight/SL3.html +++ b/techniques/silverlight/SL3.html @@ -115,7 +115,7 @@

    Providing a volume control and a Mute control as part } } -

    This example is shown in operation in the working example of Media Element Controls.

    +

    This example is shown in operation in the working example of Media Element Controls.

    Tests

    diff --git a/techniques/silverlight/SL30.html b/techniques/silverlight/SL30.html index af8be1d91b..718acc2c09 100644 --- a/techniques/silverlight/SL30.html +++ b/techniques/silverlight/SL30.html @@ -73,7 +73,7 @@

    Button is composed with a StackPanel that contains nontext </StackPanel> </Button> -

    This example is shown in operation in the working example of Button Nontext Text Composition.

    +

    This example is shown in operation in the working example of Button Nontext Text Composition.

    @@ -106,7 +106,8 @@

    Button composed, using binding and resource references

    Tests

    - Automation tree verifier +
    +

    Automation tree verifier

    Procedure

    1. Using a browser that supports Silverlight, open an HTML page that @@ -123,8 +124,8 @@

      Button composed, using binding and resource references

      Expected Results

      #3 is true.

      -

    Tests

    - Screen reader +
    +

    Screen reader

    Procedure

    1. Using a browser that supports Silverlight, open an HTML page that @@ -140,7 +141,7 @@

      Button composed, using binding and resource references

      Expected Results

      #3 is true.

      -

    Resources

    diff --git a/techniques/silverlight/SL31.html b/techniques/silverlight/SL31.html index 0dfea28d9c..56da3e9d1d 100644 --- a/techniques/silverlight/SL31.html +++ b/techniques/silverlight/SL31.html @@ -72,8 +72,8 @@ the automation peers for text elements report all necessary text content to automation as a built-in behavior of the text element controls. For more information on UI Automation and text containers, see .

    - - CSS versus Silverlight font properties +
    +

    CSS versus Silverlight font properties

    Related CSS techniques mention that users can override any page-declared CSS styling techniques, by invoking browser-specific features. For example, using Internet Explorer, a user can use Tools / Internet Options, @@ -85,9 +85,9 @@ enable similar font-property changing behavior, and include those controls in the application-specific user interface. For more information on this technique, see .

    - - - Glyphs +
    +
    +

    Glyphs

    Silverlight API includes a related text presentation API Glyphs. Glyphs is intended for specific decorative or niche language-support scenarios. The Glyphs API does not offer as much UIA exposure @@ -100,7 +100,7 @@ and instead use other text containers such as TextBox, along with a font that is supplied in the application package or known to exist on the end user system.

    - +

    Examples

    Run time applied font properties, style, and template

    @@ -163,7 +163,7 @@

    Run time applied font properties, style, and template

    rtb.Style = this.Resources["NewStyle"] as Style; } -

    This example is shown in operation in the working example of Document Structure.

    +

    This example is shown in operation in the working example of Document Structure.

    Tests

    diff --git a/techniques/silverlight/SL32.html b/techniques/silverlight/SL32.html index 4f946add94..b87321e57b 100644 --- a/techniques/silverlight/SL32.html +++ b/techniques/silverlight/SL32.html @@ -28,8 +28,8 @@ TextBlock - - UI Automation programmatic access +
    +

    UI Automation programmatic access

    For programming information that is relevant for how Silverlight application authors produce the application, each text container has its own object model/API. That API is documented on MSDN, specifically for each class TextBox; RichTextBox; TextBlock.) @@ -47,9 +47,9 @@ application in a platform view. Different types of "text" in a general sense might appear as different UI Automation patterns, as is described below.

    - - - TextBox +
    +
    +

    TextBox

    A TextBox within the Silverlight content area is reported to UI Automation as an Edit role (through MSAA, as Editable Text).

    @@ -64,9 +64,9 @@ general model should also be used for Silverlight user interface design. For more information on labeling for TextBox controls, see .

    - - - RichTextBox +
    +
    +

    RichTextBox

    A RichTextBox within the Silverlight content area is reported to UI Automation and MSAA as a Document role.

    A RichTextBox can either be set to be a read-only @@ -81,9 +81,9 @@ the assistive technology does not necessarily have to implement code that handles the entirety of the information that the Text pattern reports.

    - - - More about the Text pattern +
    +
    +

    More about the Text pattern

    The Text pattern provides APIs to iterate over the internal structure of a document and return text ranges. Each such text range can be queried for specific properties, and can return its plain text string value @@ -123,9 +123,9 @@

    MSAA has only limited possibilities for interacting with a Document role, and MSAA code for attempting to do so is not shown.

    - - - TextBlock +
    +
    +

    TextBlock

    TextBlock is reported as a Text role in UI Automation. TextBlock has several important characteristics:

    @@ -157,7 +157,7 @@ modes that screen readers use for a conventional non-interactive HTML document text. For example, some screen readers support a mode that reads text by line, or by word. These modes can read text from a TextBlock.

    - +

    Examples

    Structure from a container that has non-semantic role diff --git a/techniques/silverlight/SL33.html b/techniques/silverlight/SL33.html index df7dc998c0..56f7ef3907 100644 --- a/techniques/silverlight/SL33.html +++ b/techniques/silverlight/SL33.html @@ -31,8 +31,8 @@ in code is technically possible.

    For more information on XAML in Silverlight, see Silverlight XAML Overview on MSDN.

    - - XAML and XML +
    +

    XAML and XML

    XAML is based on XML, and shares many of its language features. Some of the language features that are directly relevant to the stated intent of SC4.1.1 and to 4.1.1 related techniques include:

    @@ -76,9 +76,9 @@ both verify XAML validity as well as receive design-time information for how to correct any XAML validity errors. - - - XAML parsing and HTML parsing +
    +
    +

    XAML parsing and HTML parsing

    In the Silverlight implementation, XAML is like HTML in that it is loaded and parsed just-in-time. Silverlight XAML is not precompiled to binary or MSIL (the language-neutral CLR runtime format). Instead,Silverlight @@ -105,7 +105,7 @@ from running. This is different from typical (non-xHTML) HTML, where implementations are permitted to contain nonrecognized elements or attributes and ignore them.

    - +

    Examples

    XAML in design tools for Silverlight

    @@ -119,8 +119,8 @@

    XAML in design tools for Silverlight

  • XAML Names are unique in namescope
  • XAML has no duplicate attributes
    • - - More about design tools and XAML +
    +

    More about design tools and XAML

    Silverlight XAML is able to be loaded by design tools for Silverlight. In the design tool, the XAML is interpreted much like the runtime interprets it, in order to show the visual representation of the Silverlight application. @@ -141,7 +141,7 @@

    XAML in design tools for Silverlight

    with in a design mode, it is the Silverlight runtime XAML parser on each client installation that is the ultimate determinant of whether the XAML is valid or invalid.

    - +
    @@ -166,7 +166,8 @@

    Silverlight application consumer

    Tests

    - Pass case +
    +

    Pass case

    Procedure

    1. Using a browser that supports Silverlight, open an HTML page that @@ -178,8 +179,8 @@

      Silverlight application consumer

      Expected Results

      #2 is true.

      -

    Tests

    - Fail case +
    +

    Fail case

    Procedure

    1. Using a browser that supports Silverlight, open an HTML page that @@ -203,7 +204,7 @@

      Silverlight application consumer

      test might need to be run against a preproduction or debug version of the application.

    -

    Resources

    diff --git a/techniques/silverlight/SL34.html b/techniques/silverlight/SL34.html index d745910ecd..1f8137e299 100644 --- a/techniques/silverlight/SL34.html +++ b/techniques/silverlight/SL34.html @@ -37,8 +37,8 @@ through a keyboard navigation technique other than TAB. For more information, see Focus Overview on MSDN.

    - - How Silverlight implements tab sequence concepts +
    +

    How Silverlight implements tab sequence concepts

    The Silverlight programming model defines a Control class that is a base class of many of the practical controls that produce a Silverlight application user interface. One of the behaviors of the Control class @@ -61,9 +61,9 @@ sequence happens as a secondary effect.

  • Reorder the tab sequence directly.
    • - - - Changing control properties +
    +
    +

    Changing control properties

    • Setting the Visibility property of a control to Collapsed causes the control to no longer render @@ -76,9 +76,9 @@ may appear as gray rather than black. As a secondary effect, that control is removed from the tab sequence.
    - - - Changing specific tab properties +
    +
    +

    Changing specific tab properties

    • Setting the IsTabStop property of a control to false causes the control to no longer be focusable by keyboard or @@ -91,15 +91,15 @@ authors would specify a TabIndex for any controls that are involved in a deliberate segment of tab order re-ordering.
    - - - Tab order and language +
    +
    +

    Tab order and language

    Left-to-right is the default only for languages that use left-to-right reading order. For languages that use right-to-left reading order, right-to-left is also the default tab order as implemented by Silverlight runtime behavior. That language preference is declared by the acting CultureInfo. For more information on CultureInfo, see .

    - +

    Examples

    Default tab order, based on ordering in the StackPanel

    @@ -118,7 +118,7 @@

    Default tab order, based on ordering in the StackPanel

    </StackPanel> </StackPanel> -

    This example is shown in operation in the working example of Tab Sequence.

    +

    This example is shown in operation in the working example of Tab Sequence.

    @@ -169,7 +169,7 @@

    Tab order, modified by TabIndex

    </StackPanel> </UserControl> -

    This example is shown in operation in the working example of Tab Sequence TabIndex.

    +

    This example is shown in operation in the working example of Tab Sequence TabIndex.

    @@ -224,7 +224,7 @@

    Tab order, modified by changing runtime Control properties

    tb_ln.IsEnabled = false; } -

    This example is shown in operation in the working example of Tab Sequence Enabled.

    +

    This example is shown in operation in the working example of Tab Sequence Enabled.

    Tests

    diff --git a/techniques/silverlight/SL35.html b/techniques/silverlight/SL35.html index 049cd33a01..16a707e478 100644 --- a/techniques/silverlight/SL35.html +++ b/techniques/silverlight/SL35.html @@ -27,8 +27,8 @@ the Validation and ValidationSummary API, the ElementName variation of Silverlight data binding, and the general behavior of TextBox elements.

    - - Contrast for validation states of the Label control +
    +

    Contrast for validation states of the Label control

    Silverlight version 4's default visual styles have a bug where the colors used to indicate an invalid field entry by changing the color of the foreground text do not satisfy the 4.5:1 contrast ratio per @@ -41,7 +41,7 @@ changed template was referenced and included in the application. The specific changed line is indicated by a comment in the Example 1 sample markup.

    - +

    Examples

    Two form fields with validation on Submit, and an error @@ -222,12 +222,12 @@

    Two form fields with validation on Submit, and an error

    The following image is a screen shot of this simple UI, after two invalid values are entered in the form and Submit is activated:

    -

    - +

    + - Form with invalid values +
    Form with invalid values
    -

    +

    The following image is a screen shot of the UIAVerify tree view of this same application. Note the "Text" role items that appear as adjacent peer elements, which describe the validation errors. This @@ -241,19 +241,19 @@

    Two form fields with validation on Submit, and an error
  • the user clicks (or tabs to) the relevant field, which focuses it
    • -

    - +

    + - UIAVerify tree view of form with invalid values +
    UIAVerify tree view of form with invalid values
    -

    -

    This example is shown in operation in the working example of Accessible Validation.

    - - Validation style for Label controls +
    +

    This example is shown in operation in the working example of Accessible Validation.

    +
    +

    Validation style for Label controls

    The default validation style for the Invalid state of Label does not have adequate contrast by default. Application authors can restyle Label with a new template that has a 4.5:1 contrast.

    - +

    Tests

    diff --git a/techniques/silverlight/SL4.html b/techniques/silverlight/SL4.html index 2e083c0761..abc1b3a19b 100644 --- a/techniques/silverlight/SL4.html +++ b/techniques/silverlight/SL4.html @@ -46,8 +46,8 @@
  • Exchanging information through the HTML DOM and declaring properties of one or both instances as Scriptable by the DOM.
    • - - Silverlight runtime language determination +
    +

    Silverlight runtime language determination

    Regardless of how HTML Lang is declared on the defining object tags, many aspects of how Silverlight works with language and culture information at run time are not determined by HTML Lang, and are instead determined @@ -55,7 +55,7 @@ running. For more information, see Understanding Language/Culture Properties as Used by Silverlight Applications and Assistive Technologies.

    - +

    Examples

    Two Silverlight object tags, each with different HTML @@ -150,7 +150,7 @@

    Two Silverlight object tags, each with different HTML } } -

    This example is shown in operation in the working example of SilverFish.

    +

    This example is shown in operation in the working example of SilverFish.

    Tests

    diff --git a/techniques/silverlight/SL5.html b/techniques/silverlight/SL5.html index 8ebf38e3ce..0d7aa0ad68 100644 --- a/techniques/silverlight/SL5.html +++ b/techniques/silverlight/SL5.html @@ -150,7 +150,7 @@

    Defining the FocusableImage XAML template and C# code } } -

    This example is shown in operation in the working example of Focusable Image.

    +

    This example is shown in operation in the working example of Focusable Image.

    @@ -173,7 +173,8 @@

    Using the FocusableImage class in UI and applying AutomationProperties.Name<

    Tests

    - Automation Tree +
    +

    Automation Tree

    Procedure

    1. Open the test HTML page in a Silverlight-supported useragent host; @@ -200,8 +201,8 @@

      Using the FocusableImage class in UI and applying AutomationProperties.Name<

      Expected Results

      #3 is true.

      -

    Tests

    - Screen Reader +
    +

    Screen Reader

    Procedure

    1. Using a browser that supports Silverlight, open an HTML page that @@ -216,7 +217,7 @@

      Using the FocusableImage class in UI and applying AutomationProperties.Name<

      Expected Results

      #3 is true.

      -

    Resources

    diff --git a/techniques/silverlight/SL6.html b/techniques/silverlight/SL6.html index e9a2417d98..15e5840ff2 100644 --- a/techniques/silverlight/SL6.html +++ b/techniques/silverlight/SL6.html @@ -134,7 +134,7 @@

    SimpleNumericUpDown control and its peer

    OwnerControl.NumericValue = Convert.ToInt32(value); } -

    This example is shown in operation in the working example of Simple Numeric UpDown control.

    +

    This example is shown in operation in the working example of Simple Numeric UpDown control.

    Tests

    diff --git a/techniques/silverlight/SL7.html b/techniques/silverlight/SL7.html index 56081bcd12..d7d847813e 100644 --- a/techniques/silverlight/SL7.html +++ b/techniques/silverlight/SL7.html @@ -29,8 +29,8 @@ on the control class, to assist design tools. The best resource for general information about Silverlight control customization is Silverlight documentation on MSDN.

    - - Component Parts +
    +

    Component Parts

    Some controls are created by assembling various component parts that are already defined as controls either by the Silverlight run time libraries or by third parties. That scenario is not really what this @@ -42,9 +42,9 @@ at a lower level for the control as a whole. The actual focus region is defined by the control author in that case, and the focus indicator is also defined to match the behavior visually and functionally.

    - - - Design for Focus Indicators +
    +
    +

    Design for Focus Indicators

    The general design principles for visual focus indicators are that the indicators should apply a visual change to the focus region's exterior margin. A common pattern is to deliberately define the visuals for @@ -77,9 +77,9 @@ the mouse or by pressing SPACE or ENTER with keyboard focus on the RepeatButton). To see this behavior in a live sample, see RepeatButton sample on MSDN.

    - - - Logic for Focus Indicators +
    +
    +

    Logic for Focus Indicators

    Typical logic is that the border to indicate focus is present in the default template design, but with an initial value of Visibility=Collapsed. Then, a visual state for focus is defined with a name that properly @@ -117,9 +117,9 @@ correct state to load from the XAML templates. Examples for all of the APIs discussed here are available in the MSDN topic Creating a New Control by Creating a ControlTemplate.

    - - - Focus in Silverlight +
    +
    +

    Focus in Silverlight

    Focus in Silverlight is equivalent to the larger user interface and application concept of keyboard focus. The element that has focus is the element within the Silverlight object tree and programming model @@ -143,7 +143,7 @@ behavior, and does not require each application author to call Focus() in application code. - +

    Examples

    Visible focus indicator as a style and state

    @@ -225,7 +225,7 @@

    Visible focus indicator as a style and state

    VisualStateManager.GoToState(this, "Unfocused", false); } -

    This example is shown in operation in the working example of Visual Focus Indicator.

    +

    This example is shown in operation in the working example of Visual Focus Indicator.

    Tests

    diff --git a/techniques/silverlight/SL8.html b/techniques/silverlight/SL8.html index 3355c61949..3b9c238058 100644 --- a/techniques/silverlight/SL8.html +++ b/techniques/silverlight/SL8.html @@ -42,8 +42,8 @@ attached property AutomationProperties.HelpText. AutomationProperties.HelpText can be set in code, but is typically set in XAML that defines a Silverlight UI.

    - - HelpText and Tooltip +
    +

    HelpText and Tooltip

    The same information that is used for AutomationProperties.HelpText long text alternatives could also be useful to sighted users. In this case, the same text could be displayed in a Silverlight ToolTip control. @@ -57,7 +57,7 @@ embedded resource feature. For more information on combining Silverlight data binding and resources for common string sources, see How to Make XAML Content Localizable.

    - +

    Examples

    Displaying a long text alternative for an Image with @@ -187,25 +187,19 @@

    Using HelpText to augment existing form labels, to provide programmatically to the existing Label controls.

    After the Get Help button is clicked, the visual appearance of the application is modified:

    -

    - Before activating Get Help -

    -

    - +

    + - Image:BeforeTooltipForm.png +
    Before activating Get Help
    -

    -

    - After activating Get Help -

    -

    - +

    +
    + - Image:AfterTooltipForm.png +
    After activating Get Help
    -

    -

    This example is shown in operation in the working example of HelpText and Tooltip.

    +
    +

    This example is shown in operation in the working example of HelpText and Tooltip.

    Tests

    diff --git a/techniques/silverlight/SL9.html b/techniques/silverlight/SL9.html index 7c7fa836de..b0ac0c8b7d 100644 --- a/techniques/silverlight/SL9.html +++ b/techniques/silverlight/SL9.html @@ -59,8 +59,8 @@ often have parallel conventions whereby the user is made aware of which element is visually focused and is the current input scope presented by the assistive technology,

    - - Silverlight core control built-in keyboard functionality +
    +

    Silverlight core control built-in keyboard functionality

    The following is a list of the Silverlight-supplied controls that have some level of key equivalence as a built-in behavior. In these cases, it is not necessary to add a specific Key event handler; you @@ -87,9 +87,9 @@

  • Slider (arrow keys ) - increment/decrement values.
    • - - - Browser hosts and keyboard events +
    +
    +

    Browser hosts and keyboard events

    Silverlight is hosted as a plug-in inside a browser host. The Silverlight run-time only receives the input events that the browser host forwards to hosted plug-ins through a browser-specific program access layer. @@ -104,9 +104,9 @@ essentially reserved for use by a browser host. For more information, see Keyboard Support.

    - - - Other event models +
    +
    +

    Other event models

    This technique specifically discusses event handling for the Silverlight managed programming model. However, Silverlight also supports parallel models for event handling, either through a Silverlight run-time feature @@ -121,7 +121,7 @@ technique. For more information on other event models in Silverlight, see Events Overview for Silverlight.

    - +

    Examples

    Two examples are given. The first example is for the scenario of a Silverlight application author that is simply incorporating an existing @@ -181,7 +181,7 @@

    Built-in keyboard equivalence for core Silverlight controls

    System.Windows.Browser.HtmlPage.Plugin.Focus(); } -

    This example is shown in operation in the working example of built-in keyboard equivalents.

    +

    This example is shown in operation in the working example of built-in keyboard equivalents.

    diff --git a/techniques/silverlight/img/AfterTooltipForm.png b/techniques/silverlight/img/AfterTooltipForm.png new file mode 100644 index 0000000000..df701dca31 Binary files /dev/null and b/techniques/silverlight/img/AfterTooltipForm.png differ diff --git a/techniques/silverlight/img/BeforeTooltipForm.png b/techniques/silverlight/img/BeforeTooltipForm.png new file mode 100644 index 0000000000..fafdb228d5 Binary files /dev/null and b/techniques/silverlight/img/BeforeTooltipForm.png differ diff --git a/techniques/silverlight/img/default_button_focus.png b/techniques/silverlight/img/default_button_focus.png new file mode 100644 index 0000000000..c02c82b85e Binary files /dev/null and b/techniques/silverlight/img/default_button_focus.png differ diff --git a/techniques/silverlight/img/encoder_scr.png b/techniques/silverlight/img/encoder_scr.png new file mode 100644 index 0000000000..72257bc4a1 Binary files /dev/null and b/techniques/silverlight/img/encoder_scr.png differ diff --git a/techniques/silverlight/img/highconafter.png b/techniques/silverlight/img/highconafter.png new file mode 100644 index 0000000000..a727566d38 Binary files /dev/null and b/techniques/silverlight/img/highconafter.png differ diff --git a/techniques/silverlight/img/highconbefore.png b/techniques/silverlight/img/highconbefore.png new file mode 100644 index 0000000000..fbc2f7a135 Binary files /dev/null and b/techniques/silverlight/img/highconbefore.png differ diff --git a/techniques/silverlight/img/listboxbar.png b/techniques/silverlight/img/listboxbar.png new file mode 100644 index 0000000000..5195535866 Binary files /dev/null and b/techniques/silverlight/img/listboxbar.png differ diff --git a/techniques/silverlight/img/newfontsize.png b/techniques/silverlight/img/newfontsize.png new file mode 100644 index 0000000000..e6a45fcb24 Binary files /dev/null and b/techniques/silverlight/img/newfontsize.png differ diff --git a/techniques/silverlight/img/originalfontsize.png b/techniques/silverlight/img/originalfontsize.png new file mode 100644 index 0000000000..5e1dee9f58 Binary files /dev/null and b/techniques/silverlight/img/originalfontsize.png differ diff --git a/techniques/silverlight/img/popup_keys.png b/techniques/silverlight/img/popup_keys.png new file mode 100644 index 0000000000..ecd4299c70 Binary files /dev/null and b/techniques/silverlight/img/popup_keys.png differ diff --git a/techniques/silverlight/img/reskinned_button_focus.png b/techniques/silverlight/img/reskinned_button_focus.png new file mode 100644 index 0000000000..30acbb40f4 Binary files /dev/null and b/techniques/silverlight/img/reskinned_button_focus.png differ diff --git a/techniques/silverlight/img/uiatree_simplepeerforwarding.png b/techniques/silverlight/img/uiatree_simplepeerforwarding.png new file mode 100644 index 0000000000..da01718d35 Binary files /dev/null and b/techniques/silverlight/img/uiatree_simplepeerforwarding.png differ diff --git a/techniques/silverlight/img/validating_screenshot.png b/techniques/silverlight/img/validating_screenshot.png new file mode 100644 index 0000000000..9a11136556 Binary files /dev/null and b/techniques/silverlight/img/validating_screenshot.png differ diff --git a/techniques/silverlight/img/validating_uia.png b/techniques/silverlight/img/validating_uia.png new file mode 100644 index 0000000000..a9327f32cd Binary files /dev/null and b/techniques/silverlight/img/validating_uia.png differ diff --git a/techniques/technique-template.html b/techniques/technique-template.html index 89ea59a30b..9fb11245d3 100644 --- a/techniques/technique-template.html +++ b/techniques/technique-template.html @@ -14,7 +14,7 @@

    Metadata

    When to Use

    -

    Describe the situations in which to use the technique, such as types of pages, features in use that might use the technique, etc.

    +

    Describe the situations in which to use the technique, such as types of pages, features in use that might use the technique, etc. Do not add references to the part of WCAG to which the technique relates; this is taken from the Understanding pages and inserted in technique pages upon publication.

    Description

    @@ -28,11 +28,12 @@

    Examples

    Example Title

    Description

    Code sample -

    Working example: link

    +

    Working example of {Example Title}

    Tests

    +

    Tests must have a test procedure and expected results. Populate the following sections as appropriate. If a technique has multiple alternative testing approaches, add a new section with class="test" for each one, and put the test-procedure and test-results sections inside that.

    Procedure

      @@ -48,9 +49,17 @@

      Expected Results

    +
    +

    Resources

    +

    Provide links to external resources that are relevant to users of the technique. This section is optional.

    +
      +
    • Link
      • +
    +
    diff --git a/understanding/20/focus-visible.html b/understanding/20/focus-visible.html index f45a0b23a5..af86f64786 100644 --- a/understanding/20/focus-visible.html +++ b/understanding/20/focus-visible.html @@ -25,7 +25,7 @@

    Intent of Focus Visible

    Note that a keyboard focus indicator can take different forms. One common way is a caret within the text field to indicate that the text field has the keyboard focus. - Another is a visual change to a button to indicate that that button has the keyboard + Another is a visual change to a button to indicate that the button has the keyboard focus.

    diff --git a/understanding/21/identify-input-purpose.html b/understanding/21/identify-input-purpose.html index 590550e8c2..ce5ea2f21e 100644 --- a/understanding/21/identify-input-purpose.html +++ b/understanding/21/identify-input-purpose.html @@ -10,30 +10,29 @@

    Understanding Identify Input Purpose

    Intent of this Success Criterion

    -

    The intent of this Success Criterion is to help people recognize and understand the purpose of form input fields. When people fill in a web form, they are usually expected to provide information about themselves in various fields. Examples are first name, family name, street address, postal code, username, or credit card details. Specifying what kind of data is expected in a particular field makes filling out forms easier, especially for people with cognitive disabilities.

    -

    While appropriate visible labels and instruction can help users understand the purpose of form input fields, users may benefit from having fields devoted to specific types of information be presented/displayed in an unambiguous, consistent, and possibly customizable way - either through defaults in their user agent, or through the aid of assistive technologies. To this end, form input fields require programmatically determinable information about their purpose.

    -

    For some input fields, the type attribute already offers a way to specify the purpose, for example, input type="tel", input type="email", or input type="password". However, these are only very broad categories, describing the type of input, but not necessarily its purpose.

    -

    Currently a well-supported way of identifying input purpose is using the autocomplete values from HTML5.2. The HTML autocomplete attribute allows a more fine-grained identification of purpose than the type attribute, for example, by allowing the author to specify whether a password is a current password (autocomplete="current-password") or a newly selected password intended to replace the current password (autocomplete="new-password").@@need a different example other than password.

    -

    For fields with autocomplete values set, the browser can suggest and 'autofill' the right content by autocompleting these fields based on past user input stored in the browser. The user is relieved of having to type the information, and can instead confirm or - if needed - change the value of the field.

    -

    In addition to helping user agents provide the appropriate autofill behavior, the autocomplete values may also be used by assistive technologies to customize the presentation of input fields to users. For example, assistive technologies may display familiar icons next to input fields to help users who have difficulties reading. An icon of a person may be shown in front of an input field with autocomplete="name", or the icon of a telephone in front of an input field with autocomplete="tel".

    -

    When the user agent and assistive technology support for other metadata formats matures, metadata schemes like the Personalization Semantics Content Module may be used in addition or instead of the HTML autocomplete attribute to identify the purpose of input fields. These metadata need not be limited to input fields and can provide a richer context for interface personalization. They can also support automated adaptations that identify and match author-provided input labels to defined vocabularies or symbols that are used instead for labelling inputs.

    +

    The intent of this Success Criterion is to ensure that the purpose of a form input collecting information about the user can be programmatically determined, so that user agents can extract and present this purpose to users using different modalities. The ability to programmatically declare the specific kind of data expected in a particular field makes filling out forms easier, especially for people with cognitive disabilities.

    +

    Appropriate visible labels and instruction can help users understand the purpose of form input fields, but users may benefit from having fields that collect specific types of information be rendered in an unambiguous, consistent, and possibly customized way for different modalities - either through defaults in their user agent, or through the aid of assistive technologies.

    +

    For some input fields, the type attribute already offers a way to specify the purpose, for example, input type="tel", input type="email", or input type="password". However, these are only very broad categories, describing the type of input, but not necessarily its purpose, especially as it relates to user-specific input fields. As an example, type="email" indicates that the field is for an e-mail address but does not clarify if the purpose is for entering the user's e-mail address or some other person's e-mail.

    +

    This success criterion defines the types of user interface component inputs, found in Section 7 of the WCAG 2.1 Recommendation, that must be programmatically identified. When these user input purposes are present, and if the technology supports doing so, the field purpose must be identified programmatically.

    +

    The HTML autocomplete attribute only accepts a certain number of specific well-defined fixed values. This allows a more fine-grained definition or identification of purpose than the type attribute, for example, by allowing the author to specify a specific type of name: Name (autocomplete="name”), Given Name (autocomplete="given-name”), Family Name (autocomplete="family-name”), as well as Username (autocomplete="username”), and Nickname (autocomplete="nickname”).

    +

    By adopting and repurposing this predefined taxonomy of definitions, user agents and assistive technologies can now present the purpose of the inputs to users in different modalities. For example, assistive technologies may display familiar icons next to input fields to help users who have difficulties reading. An icon of a birthday cake may be shown in front of an input field with autocomplete="bday", or the icon of a telephone in front of an input field with autocomplete="tel".

    +

    In addition to repurposing this taxonomy, when the autocomplete attribute technique is used to meet this Success Criteria, browsers and other user-agents can suggest and 'autofill' the right content by autocompleting these fields based on past user input stored in the browser. By defining more granular definitions of common input purposes, for example “Birthday” (autocomplete=”bday”), browsers can store personalized values for each of these fields (the user's birth day date). The user is relieved of having to type the information and can instead confirm or - if needed - change the value of the field, a significant benefit for users with memory issues, dyslexia and other disabilities. Because the autocomplete values are independent of language, users that may not be familiar with the text used to visually identify user input fields (the label) can still have that purpose consistently identified to them due to the fixed taxonomy of terms.

    +

    When the user agent and assistive technology support for other metadata formats matures, metadata schemes like the Personalization Semantics Content Module may be used in addition or instead of the HTML autocomplete attribute to identify the purpose of input fields. They can also support automated adaptations that identify and match author-provided input labels to defined vocabularies or symbols that are used instead for labelling inputs.

    Specific Benefits of Success Criterion 1.3.5:

      -
    • People with language and memory related disabilities or disabilities that affects executive function and decision making - benefit from the browser autofilling personal information (such as name or address), which means information does not need to be typed in via a keyboard.
      • -
    • People with motor impairments also benefit from reducing the need for manual input when filling out forms.
      • +
    • People with language and memory related disabilities or disabilities that affects executive function and decision-making benefit from the browser auto-filling personal information (such as name or address) when the autocomplete attribute is used to meet this Success Criteria, which means information does not need to be remembered by the user.
    • People with cerebral palsy, stroke, head injury, motor neuron disease or learning disability sometimes prefer images for communication. They can employ assistive technology which adds icons to input fields to communicate the purpose of the fields visually.
      • -
    • Assistive technology can offer a customized way of identifying particular input fields, for example, drawing on a set of symbols / icons that is familiar to the user.
      • +
    • People with motor impairments also benefit from reducing the need for manual input when filling out forms.

    Examples of Success Criterion 1.3.5

      -
    • A contact form using autofill
      A contact form auto-fills in the fields for name, street, post code, city, telephone number and email address from autofill values stored in the user's browser.
      • +
    • A contact form using autofill
      A contact form auto-fills in the fields for name, street, post code, city, telephone number and email address from autofill values stored in the user's browser. Assistive technology can offer a customized way of identifying particular input fields, for example drawing on a set of symbols / icons that is familiar to the user, to communicate the purpose of the fields visually.
    • An order from with separate billing and shipping address
      A product order form fills in the address fields for billing address and a separate set of address fields for the shipping address, using the autofill detail tokens 'billing' and 'shipping'
    • A contact form using icons
      A browser plugin to add icons inserts icons representing the person's name, home address, telephone number and email address to identify the input purpose visually.
    @@ -41,7 +40,7 @@

    Examples of Success Criterion 1.3.5

    Related Resources

    -

    Input requested form COGA TF

    +

    COGA Gap Analysis Table 3: Entering Data, Error Prevention, & Recovery

    diff --git a/understanding/21/status-messages.html b/understanding/21/status-messages.html index 7ad26955d1..061500e97a 100644 --- a/understanding/21/status-messages.html +++ b/understanding/21/status-messages.html @@ -54,20 +54,27 @@

    Examples of Changes that Do Not Add New Text to the Screen

  • Removal of status text; and
  • Non-textual status content, such as images.
    • - -
    -
    +

    Non-displayed text specific to AT users

    There may be cases where the addition of visible text does not by itself convey sufficient information to the user of assistive technology. For example, the proximity of new content to other pieces of information on the screen may provide a visual context that is lacking in the text alone.

    In such cases, authors may wish to designate additional content for inclusion in the status message, including non-displayed text which can be provided to the assistive technologies, for added context. Important considerations regarding the appropriate use of such techniques are further discussed in the Sufficient Techniques.

    +
    +

    Modification of status text

    If a status message persists on the page, modifications to this text are usually equivalent to a new status message. An example would be a shopping cart which updates text from reading "0 items" to "3 items". Typical methods of writing such changes in the page content result in the entire modified text string being considered a new change, and thus read by assistive technologies. However, where only the number in this string was coded as an updated chunk of content, the resulting experience for screen reader users would be to only hear "three", which may not be sufficient information to provide context for the user. In such situations, marking the entire "3 items" string as the status text would normally be a better solution. See Sufficient Techniques for more discussion, including the use of aria-atomic. In this case it would also be a courtesy to add offscreen text "in shopping cart" to the message.

    +
    +

    Removal of status text

    In situations where status text is entirely removed, its absence may itself convey information about the status. The most obvious example of this is where a message is displayed that the system is "busy" or "waiting". For a sighted user, when this text disappears, it is normally an indication that the state is now available. However non-sighted users would be unaware of this change, unless the end of the waiting state results in a change of context for the user. Where updating the visible message (e.g., to "system available") is not feasible, the use of a non-visible status message, such as "system available", ensures equivalent status information is provided. See Sufficient Techniques for more discussion.

    +
    +

    Non-textual status content

    Changes in content are not restricted to text changes. Where an icon or sound indicates a status message, this information will be surfaced by the screen reader through a combination of two things: 1) existing WCAG requirements governing text alternatives (under SC 1.1.1 Non-Text Content), and 2) the requirement of this current Success Criterion to supply an appropriate role.

    - +
    +
    +
    +

    Other Considerations

    @@ -136,7 +143,7 @@

    Situation C: If a status message conveys information on the progress of a pr
  • Using role="log" @@@ technique created but URL unknown
  • Using role="progressbar" (future link)
    • -
  • Using role="status" @@@ URL to update @@@ in combination with G193: Providing help by an assistant in the Web page
    • +
  • Using role="status" in combination with G193: Providing help by an assistant in the Web page

    • diff --git a/wcag20/sources/techniques/flash/img/highlighted_row_in_flash_datagrid.png b/wcag20/sources/techniques/flash/img/highlighted_row_in_flash_datagrid.png new file mode 100644 index 0000000000..5a5a16566d Binary files /dev/null and b/wcag20/sources/techniques/flash/img/highlighted_row_in_flash_datagrid.png differ diff --git a/working-examples/aria-alert-identify-errors/index.html b/working-examples/aria-alert-identify-errors/index.html new file mode 100644 index 0000000000..ea01f5d6c3 --- /dev/null +++ b/working-examples/aria-alert-identify-errors/index.html @@ -0,0 +1,73 @@ + + + + +Using role=alert to Identify Errors + + + + + +

    Using ARIA Live Regions or role=alert to Identify Errors

    +
    + +

    +
    + +

    +

    +
    + +

    +

    +
    + +

    +

    + +

    +
    + + diff --git a/working-examples/aria-alertdialog-identify-errors/index.html b/working-examples/aria-alertdialog-identify-errors/index.html new file mode 100644 index 0000000000..f9b126b2df --- /dev/null +++ b/working-examples/aria-alertdialog-identify-errors/index.html @@ -0,0 +1,71 @@ + + + + +Using aria-alertdialog to Identify Errors + + + + + + +
    +

    Using aria-alertdialog to Identify Errors

    +

    This example shows how role="alertdialog" can be used to notify someone they have entered invalid information.

    + +
    + + diff --git a/working-examples/aria-describedby-close/index.html b/working-examples/aria-describedby-close/index.html new file mode 100644 index 0000000000..5726fadde4 --- /dev/null +++ b/working-examples/aria-describedby-close/index.html @@ -0,0 +1,18 @@ + + + + + + aria-describedby example 1: Add description to close button + + + + + + +

    other content

    +
    Closing this window will discard any information entered and return you back to the main page
    + + + diff --git a/working-examples/aria-grouping-multipart-fields-ssn/index.html b/working-examples/aria-grouping-multipart-fields-ssn/index.html new file mode 100644 index 0000000000..bbae29d628 --- /dev/null +++ b/working-examples/aria-grouping-multipart-fields-ssn/index.html @@ -0,0 +1,21 @@ + + + + +Marking up forms and reporting violations for forms + + + +

    Multi-part fields like social security# and telephone#:

    +
    +
    +Social Security# + * +- +- + +
    +
    +

    Created by Sailesh Panchang, Deque Systems | July 15, 2013 || Last updated: February 26, 2014

    + + diff --git a/working-examples/aria-grouping-related-fields/index.html b/working-examples/aria-grouping-related-fields/index.html new file mode 100644 index 0000000000..24573d2f45 --- /dev/null +++ b/working-examples/aria-grouping-related-fields/index.html @@ -0,0 +1,78 @@ + + + + + + + Example - Using grouping roles to identify related form controls + + + + + + + +

    Example of using grouping roles to identify related form controls

    + +

    NB: This example does not use the script needed to make it work, but does include enough to understand the grouping mechanism.

    +
    + +

    Set Alerts for your Account

    + + +
    +
    + Your 12-digit account number +

    + - + - + +

    +
    + +
    +

    Send an alert when balance exceeds $ 3,000

    +
    + + Yes +
    +
    + + No +
    +
    +
    +

    Send an alert when a charge exceeds $ 250

    +
    + + Yes +
    +
    + + No +
    +
    +

    +
    + + + + diff --git a/working-examples/aria-invalid-data-format/index.html b/working-examples/aria-invalid-data-format/index.html new file mode 100644 index 0000000000..be5891aa80 --- /dev/null +++ b/working-examples/aria-invalid-data-format/index.html @@ -0,0 +1,85 @@ + + + + +Forms: Using aria-invalid + + + + + +

    Forms: Using aria-invalid to identify failed fields

    +

    Features

    +
      +
    • Places an aria-invalid attribute for a field only if the input data is not in the expected format. These also have generic error text alongside but the text is not tied to the field.
      • +
    • Uses a standard generic error message against every field when no data is entered. The error message is tied to the form control using aria-describedby.
      • +
    • The error displayed for a past date (after Jan 1, 2000) is associated with the field via markup
      • +
    • Every form control that fails validation has a red border and an error icon to its right (placed via CSS) for visual reinforcement
      • +
    • Date is not a required field; today's date is filled in as default
      • +
    • The error message placed above the form is within a span tag with role=alert. The SPAN tagg is within an h2 and is read by NVDA and JAWS. VoiceOver reads it in iOS and OSX.
      • +
    +

    + +
    + +
    +

    +

    +
    +
    +

    +

    +
    +
    +

    +

    +
    +
    +

    +

    +
    +

    + +

    +
    +

    About the error messages

    +
      +
    • JAWS and NVDA expose a field with aria-invalid=true as "invalid entry".
      • +
    • VoiceOver with Safari on OSX or iOS reads out the field as "invalid data"
      • +
    • The field's label (or other accessible name) is announced before the "invalid" notification.
      • +
    • The field-specific error messages when associated with aria-describedby are read by JAWS and NVDA as one tabs to the fields. VoiceOver reads these automatically only in iOS ... the error message is announced after a slight pause after the label is read. In OSX on a MacBook Pro, the VO+Shift+h key combination causes the error text referenced by aria-describedby to be read by VoiceOver.
      • +
    + + + + diff --git a/working-examples/aria-invalid-data-format/valcheck.js b/working-examples/aria-invalid-data-format/valcheck.js new file mode 100644 index 0000000000..832880c203 --- /dev/null +++ b/working-examples/aria-invalid-data-format/valcheck.js @@ -0,0 +1,244 @@ +function logincheck() { // For form-alert.htm: using JS alert +if(document.getElementById("lname").value == ""){ +alert("You forgot to enter your last name!"); +return false; +} +if(document.getElementById("usrname").value == ""){ +alert("Please enter your login name"); +return false; +} +if(document.getElementById("pwd").value == ""){ +alert("Please enter your password"); +return false; +} +alert("Sorry cannot login: login and password mismatch. Please try again."); +return true; +} // end of logincheck function + +function showTooltip( tooltip_id ) { +document.getElementById( tooltip_id ).style.display = "inline"; +} +function hideTooltip( tooltip_id ) { +document.getElementById( tooltip_id ).style.display = "none"; +} +function keydownTooltip( event, tooltip_id ) { +var e = window.event || event; +if( e.keyCode == 27 ) { +document.getElementById( tooltip_id ).style.display = "none"; +return browser.stopPropagation( e ); +} else { +return true; +}} // end of function + +function errorAlert () { // For form-alert1.htm: using innerHTML for 1 alert at a time +if(document.getElementById("lname").value == ""){ +document.getElementById("errlist").innerHTML = "
  • You forgot to enter your last name!
    • "; +return false; +} +if(document.getElementById("usrname").value == ""){ +document.getElementById("errlist").innerHTML = "
  • Please enter your login name
    • "; +return false; +} +if(document.getElementById("pwd").value == ""){ +document.getElementById("errlist").innerHTML = "
  • Please enter your password
    • "; +return false; +} +document.getElementById("errlist").innerHTML = "
  • Sorry cannot login: Login name and password mismatch. Please try again.
    • "; +return false; // with innerHTML this too has to be 'false' +} // end of errorAlert function + +function errorAlert1 () {// For form-alert2.htm: using DOM to add error text +// remove error messages already displayed: +var liTag = document.getElementById("errlist") ; +while (liTag.firstChild) { +liTag.removeChild(liTag.firstChild); +} +// done with removing messages +// Next line removes error icons +var myImg = "images/iconError.gif" ; +$('label').find('img').remove() ; +// remove aria-describedby from form controls: +$("input").removeAttr("aria-describedby"); + +// Define arrays +var fields = new Array() ; // holds id of form controls sequentially +fields[0] = "lname"; fields[1] = "usrname"; fields[2] = "pwd"; + +var messages = new Array() ; // Holds error messages +messages[0] = "You forgot to enter your last name!"; +messages[1] = "Please enter your login name"; +messages[2] = "Please enter your password"; + +var errText = new Array() ; // holds actual errors to be listed +var errId = new Array() ; // holds id of list items +var i = 0; var j = 0; errText[i] = ""; +// i can range from 0 to 2 i.e. 1 to 3 error fields +while(j<=2) { +var thisFld = document.getElementById(fields[j]); +if(thisFld.value == ""){ +errText[i] = messages[j] ; +errId[i] = String(i) ; +// Set aria-described for form control: +thisFld.setAttribute("aria-describedby", "list_" +errId[i] ) ; +// Create error icon: +newIcon = document.createElement( "img" ); +$(newIcon).attr({ +src: "images/iconError.gif", +alt: "Error " + String(parseInt(i) +1), +id: "img_" + String(i) +}); + +// place error icon within corresponding label element - same as index j. +$(document.getElementsByTagName("LABEL")[j]).append(newIcon); + +// prependImage(fields[j],lbl, errId[i] ); +i++; +} j++; +} // end of while + +if(errText[0] != "") { // means at least one error is present +var j = 0; +while(j < i) { +var liTag = document.createElement("li"); +var node=document.createTextNode(errText[j]); +liTag.appendChild(node); +liTag.setAttribute("id", "list_" + errId[j]); j++; +document.getElementById("errlist").appendChild(liTag); +} // end of while +document.getElementById("errlist").focus() +return false; +} // end of if for errText[0] not blank i.e. errors present +$(document.getElementById("errlist")).html("
  • Sorry cannot login: Login name and password mismatch. Please try again.
    • "); +return false; +} // end of errorAlert1 function + +function prependImage(elementId, strId) { +var image = new Image(); + // Set path and alt properties +image.src = "images/iconError.gif"; +image.alt = "Error " + String(parseInt(strId) +1); +image.id = "img_" + strId; + // Add it to the DOM +// This adds image before the label: +$(document.getElementById(elementId)).parent().prepend(image); + // If all went well, return false so navigation can + // be cancelled based on function outcome +return false; +} + +function errorAlert2 () {// For form-alert3.htm: using DOM to add error text + +$("div.control span").remove(); // removes generic error message +// remove aria-describedby, aria-invalid and class from form controls: +$("div.control input").removeAttr("aria-describedby aria-invalid class"); +// Define arrays +var fields = new Array() ; // holds id of form controls sequentially +fields[0] = "pin4"; fields[1] = "email"; fields[2] = "lname"; fields[3] = "startDt"; +var eFlag = 0; +var i = 0; var j = 0; +// i can range from 0 to 3 i.e. 1 to 4 error fields +while(j<=3) { +var thisFld = document.getElementById(fields[j]); +if(thisFld.value.length == 0){ +if (j < 3) { // this is not done for start date field +tieErrText(thisFld, i, "Error: Input data missing") ; +i++ ; +eFlag++; +} +if (j == 3) { // means j=3 and date is empty +var dtString =formatDate() ; +$(thisFld).prop("value", dtString); +} +} // end of check for no input data +else if (j == 0 && ( (isNaN(thisFld.value)) || (thisFld.value.length != 4))) { +eFlag = addErrText(thisFld) ; +} // end of if j == 0 +else if (j == 1 ) { // checking email field +// Checks for syntax of an email: +/* This means that the input data must contain an @ sign and at least one dot (.). +Also, the @ must not be the first character of the email address, and the last dot must be present after the @ sign, and minimum 2 characters before the end +*/ +var atpos = thisFld.value.indexOf("@"); +var dotpos = thisFld.value.lastIndexOf("."); +if (atpos<1 || dotpos= thisFld.value.length) { +eFlag = addErrText(thisFld) ; +}} // end of if j==1 +else if (j == 2) { // check last name for non-alpha characters +if (!checkAlpha(thisFld.value)) { +eFlag = addErrText(thisFld) ; +} } // end of j == 2 for last name check + +else if (j == 3 ) { // checking non-empty policy start date field +if(!ValidateDate(thisFld.value)) { +eFlag = addErrText(thisFld) ; +} +else if (!dateLater(thisFld.value)) { +tieErrText(thisFld, i, "Error: Date has passed"); +i++; eFlag++; +} +} // end of j == 3 for date check +j++; +} // end of while +if (eFlag > 0) { +$(document.getElementById("err_final")).text("Sorry cannot login: Please fix the errors and retry").focus(); +return false; +} +$(document.getElementById("err_final")).html("Sorry cannot login: PIN / Email / Name mismatch. Please retry").focus(); +return false; +} // end of errorAlert2 function + +function ValidateDate(dtValue) { +var dtRegex = new RegExp(/\b[01][0-9][\/-][0123][0-9][\/-][2][0]\d{2}\b/); +return dtRegex.test(dtValue); + } + +function checkAlpha(aWord) { +//regular expression defining aword with 2 or more alpha characters: +var alphaRegex = new RegExp(/^[a-zA-Z]{2,}$/) ; +return alphaRegex.test(aWord); + } + + +function dateLater(dtStr) { // compares input date string with current date +var yy = dtStr.substr(6) ; +var dd = dtStr.substr(3,2) ; +var mm = dtStr.substr(0,2) ; +var d1 = Date.parse(yy + "-" +mm + "-" + dd); +// var d1 = Date.parse("2013-12-25"); +var dt = new Date() ; +yy =dt.getFullYear(); +mm = dt.getMonth(); mm++; +dd = dt.getDate(); +var d2 = Date.parse(yy + "-" +mm + "-" + dd); +if (d1>= d2) { +return true; +} +return false; +} + +function tieErrText(errFld, k, errMsg) { +var errId = "err_" + String(k) ; +// A hidden field with id=spanval is used to hold content of span tag: +$(document.getElementById('spanval')).prop("value", '' + errMsg + '') ; +$(errFld).parent().append(document.getElementById('spanval').value); +// Set aria-described for form control: +errFld.setAttribute("aria-describedby", errId) ; +errFld.setAttribute("class", "error") ; +} + +function addErrText(errFld) { +$(errFld).attr("aria-invalid", "true").attr("class", "error"); +// Suffix error text: +$(errFld).parent().append('Error: Incorrect data'); +return 1; +} + +function formatDate() { +var dt1 = new Date(); +var mm = dt1.getMonth(); mm++ ; +if (mm < 10) { mm ="0" + mm; } +var dd = dt1.getDate() ; +if (dd < 10) { dd ="0" + dd; } +var dtStr = mm + "/" + dd +"/" + dt1.getFullYear(); +return dtStr; +} diff --git a/working-examples/aria-invalid-required-fields/index.html b/working-examples/aria-invalid-required-fields/index.html new file mode 100644 index 0000000000..a1a2f35697 --- /dev/null +++ b/working-examples/aria-invalid-required-fields/index.html @@ -0,0 +1,62 @@ + + + Input Error Notification with aria-live=assertive and aria-invalid using jQuery + + + + + + + +

    +
    +

    +
    + +

    +

    +
    + +

    +

    +
    + +

    +

    + +

    +
    + + diff --git a/working-examples/aria-label-invisible-label-box/index.html b/working-examples/aria-label-invisible-label-box/index.html new file mode 100644 index 0000000000..0eec3741ee --- /dev/null +++ b/working-examples/aria-label-invisible-label-box/index.html @@ -0,0 +1,36 @@ + + + + + aria-label: 2. Example close-button + + + + + + + +

    Display a div box

    + +
    + This is a div box. + +
    + + + \ No newline at end of file diff --git a/working-examples/aria-labelledby-description-complex-graphic/emptystar.png b/working-examples/aria-labelledby-description-complex-graphic/emptystar.png new file mode 100644 index 0000000000..86cb6f4203 Binary files /dev/null and b/working-examples/aria-labelledby-description-complex-graphic/emptystar.png differ diff --git a/working-examples/aria-labelledby-description-complex-graphic/fullstar.png b/working-examples/aria-labelledby-description-complex-graphic/fullstar.png new file mode 100644 index 0000000000..ad50230b6b Binary files /dev/null and b/working-examples/aria-labelledby-description-complex-graphic/fullstar.png differ diff --git a/working-examples/aria-labelledby-description-complex-graphic/index.html b/working-examples/aria-labelledby-description-complex-graphic/index.html new file mode 100644 index 0000000000..74cb9a407d --- /dev/null +++ b/working-examples/aria-labelledby-description-complex-graphic/index.html @@ -0,0 +1,21 @@ + + + + +ARIA10 Example 1 + + + + +

    ARIA10 - Example 1

    +
    + + + + + +
    + +
    4 of 5
    + + diff --git a/working-examples/aria-labelledby-table-text-inputs/index.html b/working-examples/aria-labelledby-table-text-inputs/index.html new file mode 100644 index 0000000000..acb61841cc --- /dev/null +++ b/working-examples/aria-labelledby-table-text-inputs/index.html @@ -0,0 +1,29 @@ + + + + +Testing aria-labelledby: A simple table with text inputs - code + + + + + + + + + + + + + + + + + + + + + +
    TaxpayerSpouse
    W2 Gross
    Dividends
    + + diff --git a/working-examples/aria-labelledby-time-out-input-concatenated-label/index.html b/working-examples/aria-labelledby-time-out-input-concatenated-label/index.html new file mode 100644 index 0000000000..3a44053be0 --- /dev/null +++ b/working-examples/aria-labelledby-time-out-input-concatenated-label/index.html @@ -0,0 +1,23 @@ + + + + +aria-labelledby example 1: Extend time-out + + + + + +

    Extend timeout

    + +
    +

    + + minutes

    +
    + + +

    (Adapted from Easy ARIA tip #2: aria-labelledby and aria-describedby, an example put together by Marco Zehe in 2008)

    + + diff --git a/working-examples/aria-labelledby-workshop-booking-timetable/index.html b/working-examples/aria-labelledby-workshop-booking-timetable/index.html new file mode 100644 index 0000000000..baaf7ac57d --- /dev/null +++ b/working-examples/aria-labelledby-workshop-booking-timetable/index.html @@ -0,0 +1,104 @@ + + + + +Dinosaur conference + + + +

    Dinosaur conference workshops timetable Thursday, 14. & Friday, 15. March 2013

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +Dinosaur conference workshop booking table +
    ThursdayFriday
    9 to 12 AM2 to 5 PM9 to 12 AM2 to 5 PM
    track 1 +

    The Paleozoic era

    +

    2 places left

    +

    +

    +     		+

    The Mesozoic era overview

    +

    2 places left

    +

    +

    +     		+

    The Triassic period, rise of the dinosaurs

    +

    1 place left

    +

    +

    + +     		+

    The Jurassic period

    +

    11 places left

    +

    +

    +
    track 2 +

    The Cretaceous period

    +

    18 places left

    +

    +

    +     		+

    The end of the dinosaurs

    +

    2 places left

    +

    +

    +     		+

    First discoveries of dinosaurs

    +

    2 places left

    +

    +

    +     		+

    Emerging scholarship

    +

    19 places left

    +

    +

    +
    +

     

    + + + + +
    + + (Only enter if different from last name) +
    +

     

    + + + diff --git a/working-examples/audio-contrast/bad-contrast.mp3 b/working-examples/audio-contrast/bad-contrast.mp3 new file mode 100644 index 0000000000..415b7ad60f Binary files /dev/null and b/working-examples/audio-contrast/bad-contrast.mp3 differ diff --git a/working-examples/audio-contrast/good-contrast.mp3 b/working-examples/audio-contrast/good-contrast.mp3 new file mode 100644 index 0000000000..3bdd344af7 Binary files /dev/null and b/working-examples/audio-contrast/good-contrast.mp3 differ diff --git a/working-examples/breadcrumb-trail/index.html b/working-examples/breadcrumb-trail/index.html new file mode 100644 index 0000000000..df9c98ee6e --- /dev/null +++ b/working-examples/breadcrumb-trail/index.html @@ -0,0 +1,30 @@ + + + + + G65 Example 3: Breadcrumb Example + + + +

    Breadcrumb Example

    + + + \ No newline at end of file diff --git a/working-examples/colour-picker/Colourpicker.zip b/working-examples/colour-picker/Colourpicker.zip new file mode 100644 index 0000000000..9aa2690197 Binary files /dev/null and b/working-examples/colour-picker/Colourpicker.zip differ diff --git a/working-examples/colour-picker/choosecolour.php b/working-examples/colour-picker/choosecolour.php new file mode 100644 index 0000000000..977fe8f3ad --- /dev/null +++ b/working-examples/colour-picker/choosecolour.php @@ -0,0 +1,127 @@ + + + + + Colour Picker - Choose Colour + + +body, legend, a{ color: " . htmlspecialchars($strForecolour) . "; background: " . htmlspecialchars($strBackcolour) . ";}\n"; +?> + + +

    Colour Picker - Choose Colour

    +

    +Back to the colour picker. +

    +
    +

    Foreground Colour

    +\n"; +for ($iInnerRed=0; $iInnerRed<16; $iInnerRed+=3) +{ + for ($iInnerGreen=0; $iInnerGreen<16; $iInnerGreen+=3) + { + for ($iInnerBlue=0; $iInnerBlue<16; $iInnerBlue+=3) + { + $iCounter++; + $strColour = strtoupper("#". dechex($iInnerRed) . dechex($iInnerGreen) . dechex($iInnerBlue)); + $strID = "fc" . substr($strColour, -3); + echo "\t
    "; + if ($strColour == strtoupper($strForecolour)) + echo " "; + else + echo " "; + echo "
    \n"; + if (($iCounter%8) === 0) + { + echo "\n"; + if ($iCounter < 216) + echo "
    \n"; + } + } + } +} + +?> +

    Background Colour

    +\n"; +for ($iInnerRed=0; $iInnerRed<16; $iInnerRed+=3) +{ + for ($iInnerGreen=0; $iInnerGreen<16; $iInnerGreen+=3) + { + for ($iInnerBlue=0; $iInnerBlue<16; $iInnerBlue+=3) + { + $iCounter++; + $strColour = strtoupper("#". dechex($iInnerRed) . dechex($iInnerGreen) . dechex($iInnerBlue)); + $strID = "bc" . substr($strColour, -3); + echo "\t
    "; + if ($strColour == strtoupper($strBackcolour)) + { + echo " "; + } + else + { + echo " "; + } + echo "
    \n"; + if (($iCounter%8) === 0) + { + echo "
    \n"; + if ($iCounter < 216) + echo "
    \n"; + } + } + } +} + +?> +
    + +
    + + +

    +Back to the colour picker. +

    + + + diff --git a/working-examples/colour-picker/colourpicker.js b/working-examples/colour-picker/colourpicker.js new file mode 100644 index 0000000000..ad1bddbcac --- /dev/null +++ b/working-examples/colour-picker/colourpicker.js @@ -0,0 +1,274 @@ +window.onload = init; + +function init() +{ + var objForeground = document.getElementById('forelink'); + var objBackground = document.getElementById('backlink'); + var objForm = document.getElementById('colourpicker'); + + // Set up event handlers for foreground and background colour picker links + objForeground.onclick = function(){return selectColour(this);}; + objBackground.onclick = function(){return selectColour(this);}; + // Set up an event handler for when the form is submitted + objForm.onsubmit = function(){return changeColour();}; +} + +// Function to build the colour picker +// objElement is the anchor used to activate the dialog +function selectColour(objElement) +{ + var iInnerRed, iInnerGreen, iInnerBlue, strColour; + var iCounter = 0; + var objExisting = document.getElementById('cchoices'); + var objPicker = document.createElement('div'); + var objRow = document.createElement('div'); + var objAnchor, objCol, objImage; + + // If the colour picker dialog is already present, remove it + if (objExisting) + { + objExisting.parentNode.removeChild(objExisting); + } + objPicker.setAttribute('id', 'cchoices'); + + // Start to build the colour picker + + // Add a panel to contain the currently selected colour + objCol = document.createElement('div'); + objCol.appendChild(document.createTextNode('#000')); + objCol.setAttribute('id', 'tooltip'); + objRow.appendChild(objCol); + objPicker.appendChild(objRow); + objRow = document.createElement('div'); + + // Iterate through all web-safe colours (e.g. #fc0) to build + // a colour picker grid + // Steps of 16 for red, green, and blue + for (iInnerRed=0; iInnerRed<16; iInnerRed+=3) + { + for (iInnerGreen=0; iInnerGreen<16; iInnerGreen+=3) + { + for (iInnerBlue=0; iInnerBlue<16; iInnerBlue+=3) + { + iCounter++; + + // Add a colour cell for our grid + objCol = document.createElement('span'); + // Convert our red, green, and blue values to hexadecimal to + // create a short-hand hex triplet colour value + strColour = '#' + iInnerRed.toString(16).toUpperCase() + iInnerGreen.toString(16).toUpperCase() + iInnerBlue.toString(16).toUpperCase(); + + // Add an anchor and events to handle mouse and keyboard behaviour + objAnchor = document.createElement('a'); + objAnchor.setAttribute('href', '#'); + objAnchor.setAttribute('id', 'cp' + iCounter); + objAnchor.onclick = function(){return setColour(this, objElement);}; + objAnchor.onkeydown = function(event){return navigatePicker(this, event);}; + objAnchor.onfocus = function(){return updateTooltip(this);}; + objAnchor.onmouseover = function(){return updateTooltip(this);}; + + // Add a transparent image with the alt text containing the colour value + // and set the background property of the image using the colour value + objImage = document.createElement('img'); + objImage.setAttribute('src', 'pot.gif'); + objImage.setAttribute('width', '10'); + objImage.setAttribute('height', '10'); + objImage.setAttribute('alt', strColour); + objImage.style.backgroundColor = strColour; + objAnchor.appendChild(objImage); + objCol.appendChild(objAnchor); + + // Add the cell to the current row in our grid + objRow.appendChild(objCol); + + // Limit each row to 12 cells + if (iCounter%12 === 0) + { + objPicker.appendChild(objRow); + objRow = document.createElement('div'); + } + } + } + } + // Add the picker to the document, and set focus on + // the first cell in the grid + document.body.appendChild(objPicker); + document.getElementById('cp1').focus(); + + return false; +} + +// Function to update the panel with the currently selected colour +// in the colour picker dialog (either from mouse hover, or +// keyboard focus) +// +// objElement is the anchor that is currently selected +function updateTooltip(objElement) +{ + // Get existing tooltip + var objExisting = document.getElementById('tooltip'); + + // Setup a new tooltip + var objCol = document.createElement('div'); + var strColour = objElement.firstChild.getAttribute('alt'); + objCol.appendChild(document.createTextNode(strColour)); + objCol.setAttribute('id', 'tooltip'); + + // Replace the old tooltip with the new tooltip + objExisting.parentNode.replaceChild(objCol, objExisting); +} + +// Function to update the short-hand hex triplet colour in +// the form. +// +// In this example, the form fields have id values +// of foreground and background. The href attribute of the links +// to activate the colour picker control also has target ids of +// foreground and background. +// +// objAnchor is the anchor that was selected from the colour picker +// objInput is the anchor that was used to activate the colour picker +function setColour(objAnchor, objInput) +{ + // Extract the id from the href attribute + var strID = objInput.href.substring(objInput.href.length - 10); + var objColour = document.getElementById(strID); + var objPicker = document.getElementById('cchoices'); + // Extract the colour value from the alt attribute + var strColour = objAnchor.firstChild.getAttribute('alt'); + + // Set the value attribute of the input form + // Belts and braces because of a bug in Mozilla + objColour.value = strColour; + objColour.setAttribute('value', strColour); + // Remove the colour picker dialog + objPicker.parentNode.removeChild(objPicker); + // Place focus in the input field + objColour.focus(); + + return false; +} + +// Function to change the colours on the page when the form is submitted +function changeColour() +{ + var objHead = document.getElementsByTagName('head')[0]; + var objStyle = document.createElement('style'); + // Get foreground and background colours from form + var strFore = document.getElementById('foreground').value; + var strBack = document.getElementById('background').value; + // Create a style block + var strCSS = 'body, legend, a{ color: ' + strFore + '; background: ' + strBack + ';}'; + var objText = document.createTextNode(strCSS); + + // If we already have a style block, remove it + var objExisting = document.getElementsByTagName('style')[0]; + + if (objExisting) + { + objExisting.parentNode.removeChild(objExisting); + } + + objStyle.setAttribute('type', 'text/css'); + + // IE doesn't allow text to be appended to style elements, + // so use the proprietary cssText property if it exists, + // otherwise, append the style block + if (objStyle.styleSheet) + { + objStyle.styleSheet.cssText = strCSS; + } + else + { + objStyle.appendChild(objText); + } + + objHead.appendChild(objStyle); + + // Set cookie values so the values can persist on other pages + setCookie('forecolour', strFore); + setCookie('backcolour', strBack); + + return false; +} + +// A function to improve keyboard access to the picker +// allowing users to navigate by column and row using +// the cursor keys +// +// objAnchor is the currently selected cell +// objEvent is the W3C object property +function navigatePicker(objAnchor, objEvent) +{ + var iKeyCode, strID, iCurID, iDestID, objPicker; + + // If W3C object property is undefined, use + // IE's proprietary window.event property + if (!objEvent) + { + objEvent = window.event; + } + + iKeyCode = objEvent.keyCode; + + // If the ESC key is pressed, remove the colour picker + if (iKeyCode == 27) + { + objPicker = document.getElementById('cchoices'); + + objPicker.parentNode.removeChild(objPicker); + } + + // if any key other than cursor keys are pressed, + // pass control back to the colour picker + if (iKeyCode < 37 || iKeyCode > 40) + { + return true; + } + + // Determine the number of the current cell + // The id for each cell is cp1, cp2, and so on + strID = objAnchor.getAttribute('id'); + iCurID = strID.substr(2, 4); + + // Find out which cursor key was pressed + switch (iKeyCode) + { + case 37: // Left cursor key + iDestID = iCurID - 1; + break; + case 38: // Up cursor key + iDestID = iCurID - 12; + break; + case 39: // Right cursor key + iDestID = parseInt(iCurID, 10) + 1; + break; + case 40: // Down cursor key + iDestID = parseInt(iCurID, 10) + 12; + break; + } + + // If an id exists with the value, move focus + // to the cell with that id + if (document.getElementById('cp' + iDestID)) + { + document.getElementById('cp' + iDestID).focus(); + } + + return false; +} + +// A function to set a cookie +// +// strName is the name of the cookie +// strValue is the value for the cookie +function setCookie(strName, strValue) +{ + var dtExpires = new Date(); + + // Set an expiry date of 1 year + dtExpires.setTime(dtExpires.getTime() + (1000 * 60 * 60 * 24 * 365)); + + // Write the cookie + document.cookie = strName + '=' + strValue + '; expires=' + dtExpires.toGMTString() + '; path=/'; +} diff --git a/working-examples/colour-picker/index.php b/working-examples/colour-picker/index.php new file mode 100644 index 0000000000..0568765492 --- /dev/null +++ b/working-examples/colour-picker/index.php @@ -0,0 +1,85 @@ + + + + Colour Picker + + + +body, legend, a{ color: " . htmlspecialchars($strForecolour) . "; background: " . htmlspecialchars($strBackcolour) . ";}\n"; +?> + + +

    Colour Picker

    +
    +
    +Colours +
    + + +
    +
    + + +
    +
    +
    + +
    +
    +

    Random Text

    +

    +Demonstrate persistence on another page.

    +

    Source code for this example (zip)

    +

    +Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent at velit non massa semper suscipit. Quisque dapibus, urna vel lacinia ullamcorper, velit nulla porttitor eros, eget tincidunt velit purus id nunc. Maecenas magna. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In turpis lorem, rutrum vel, semper feugiat, ultricies et, urna. Nam vel nunc id ligula ultricies porta. Nullam non lorem. Pellentesque sit amet augue. Phasellus leo turpis, aliquam posuere, facilisis dapibus, bibendum et, ante. Praesent ipsum tortor, hendrerit eget, tempus in, porta vel, turpis. Phasellus urna lacus, laoreet vel, volutpat eget, tincidunt sagittis, ipsum. +

    +

    +Maecenas id leo. Donec massa enim, auctor at, aliquam sed, convallis sed, diam. Duis mattis sodales nisl. Integer nunc. Maecenas et quam. Quisque non sem quis purus faucibus tempor. Curabitur ipsum elit, dapibus sed, lobortis non, ornare at, arcu. Vivamus facilisis pharetra metus. Integer a dui sit amet nisl consectetuer ultrices. Praesent sed erat a velit interdum euismod. Curabitur laoreet. Suspendisse potenti. Vestibulum ut pede ac nibh sollicitudin cursus. Morbi eu est. Nulla eros metus, egestas at, interdum vel, ultrices eget, est. Nullam tempor, arcu sed tincidunt iaculis, ipsum ligula egestas lacus, at aliquam ligula sapien at nunc. Sed ligula. +

    +

    +Fusce eget quam. Nulla facilisi. Donec quis diam ut metus aliquet mattis. Vestibulum eu libero. Aenean porttitor felis vel nunc. Proin volutpat euismod velit. Proin porttitor enim eu libero. Sed tortor ipsum, dignissim eu, consequat elementum, pellentesque eu, elit. Morbi laoreet risus nec quam. Pellentesque pellentesque lacus in sapien egestas blandit. Vestibulum at metus nec lectus eleifend commodo. +

    +

    +In aliquam euismod mauris. Morbi ac diam. Phasellus bibendum odio vel lacus. Morbi justo libero, pellentesque iaculis, gravida pretium, condimentum vel, massa. Nunc nunc nisl, scelerisque eget, laoreet non, iaculis hendrerit, nisi. Etiam ut ligula a lorem adipiscing euismod. Vivamus ligula leo, bibendum quis, congue molestie, pulvinar eu, velit. Proin molestie, libero quis pellentesque tincidunt, enim felis dapibus eros, eget faucibus massa ante elementum metus. Suspendisse potenti. Nunc quis ligula non augue commodo semper. Cras mollis aliquam magna. Cras eu tortor id ipsum consectetuer tempor. Donec ac massa sit amet ante tincidunt laoreet. Sed nisi sem, scelerisque a, dignissim in, rhoncus eget, nibh. Nunc ac orci quis magna pharetra aliquet. Fusce lectus. In massa felis, volutpat eget, iaculis sed, iaculis eu, lorem. Cras sapien. Pellentesque libero nunc, luctus in, adipiscing non, molestie in, dolor. +

    +

    +Quisque lobortis accumsan orci. Nullam arcu. Pellentesque a eros. Sed dapibus urna. Curabitur in enim. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Fusce quis purus. Praesent iaculis commodo risus. Pellentesque ipsum nulla, ullamcorper et, vehicula vitae, malesuada a, diam. Cras nec neque eget mauris posuere commodo. Fusce rhoncus elementum tortor. Etiam eget pede. Cras et est. Morbi et est. Vestibulum ut orci id mauris ullamcorper lacinia. Nunc eleifend mollis eros. Suspendisse velit ligula, vulputate eget, vulputate ut, ultricies vel, risus. Donec vulputate est eu tellus. Donec magna dui, adipiscing in, mattis ac, lobortis et, purus. +

    + + + diff --git a/working-examples/colour-picker/persist.php b/working-examples/colour-picker/persist.php new file mode 100644 index 0000000000..ecb5c0f33a --- /dev/null +++ b/working-examples/colour-picker/persist.php @@ -0,0 +1,63 @@ + + + + Colour picker persistence + + +body, legend, a{ color: " . htmlspecialchars($strForecolour) . "; background: " . htmlspecialchars($strBackcolour) . ";}\n"; +?> + + +

    Colour picker persistence

    +

    +Cookies are set with JavaScript when the colour picker is used, and then used to persist the styles on other pages. If JavaScript isn't available, the server-side colour picker would set the cookies. The following is an example of how the style element could be written into the head on the fly with PHP, but the principle is the same for all server-side languages. +

    +
    <?php
+if (isset($_COOKIE["forecolour"]) && strlen($_COOKIE["forecolour"]) == 4)
+{
+    $strForecolour = $_COOKIE["forecolour"];
+}
+else
+{
+    $strForecolour = "#000";
+}
+
+if (isset($_COOKIE["backcolour"]) && strlen($_COOKIE["backcolour"]) == 4)
+{
+    $strBackcolour = $_COOKIE["backcolour"];
+}
+else
+{
+    $strBackcolour = "#FFF";
+}
+
+echo "\t<style type=\"text/css\">body, legend, a{ color: " . htmlspecialchars($strForecolour) . "; background: " . htmlspecialchars($strBackcolour) . ";}</style>\n";
+?>
    +

    +Back to the colour picker. +

    + + + diff --git a/working-examples/colour-picker/pot.gif b/working-examples/colour-picker/pot.gif new file mode 100644 index 0000000000..b242cc0bfb Binary files /dev/null and b/working-examples/colour-picker/pot.gif differ diff --git a/working-examples/colour-picker/style.css b/working-examples/colour-picker/style.css new file mode 100644 index 0000000000..e809daa3ab --- /dev/null +++ b/working-examples/colour-picker/style.css @@ -0,0 +1,122 @@ +body +{ + font: normal 95.01% helvetica, verdana, arial, sans-serif; + color:#000; + background: #fff; + margin: 0; + padding: 1em; +} + +legend +{ + color:#000; + background: #fff; +} + +h2 +{ + padding-top: 1em; + clear: both; +} + +form#colourpicker label +{ + float: left; + width: 9em; +} + +form#colourpicker div +{ + margin: 0.5em; +} + +a +{ + color: #00c; + background: #fff; +} + +a:hover, a:focus, a:active +{ + color: #00c; + background: #fc0; +} + +span.context +{ + position: absolute; + left: -999em; + width: 1em; + overflow: hidden; +} + +div#cchoices +{ + padding: 0.3em; + background: #fff; + color: #000; + border: 3px solid #000; + position: absolute; + top: 2em; + left: 15em; +} + +div#cchoices div +{ + margin: 0; + padding: 0; + text-align: center; +} + +div#cchoices div#tooltip +{ + padding: 0.2em; +} + + +div#cchoices img +{ + border: 1px solid #000; +} + +div#cchoices a +{ + padding: 0.1em; + color: #00c; + background: #fff; +} + +div#cchoices a:hover, div#cchoices a:focus, div#cchoices a:active +{ + color: #00c; + background: #fc0; +} + +div#cchoices a +{ + text-decoration: none; +} + +form#pickerform div.col +{ + float: left; + display: inline; + width: 6em; +} + +form#pickerform div.row, form#pickerform div.submit +{ + float: left; + clear: both; + width: 100%; +} + +form#pickerform span +{ + padding: 0 0.3em; +} + +form#pickerform div.submit +{ + padding: 1em 0; +} diff --git a/working-examples/css-new-window-warn/index.html b/working-examples/css-new-window-warn/index.html new file mode 100644 index 0000000000..50c13211a4 --- /dev/null +++ b/working-examples/css-new-window-warn/index.html @@ -0,0 +1,58 @@ + + + + +Pop-Up Warning + + + +

    Pop-Up Warning

    +

    +This is an example of an External linkOpens a new window +

    + + \ No newline at end of file diff --git a/working-examples/definition-list-contact-info/index.html b/working-examples/definition-list-contact-info/index.html new file mode 100644 index 0000000000..9f507eea0f --- /dev/null +++ b/working-examples/definition-list-contact-info/index.html @@ -0,0 +1,22 @@ + + + + Contact Information with Definition List + + + +

    Example of definition list displaying contact information

    +
    +
    name:
    John Doe
    +
    tel:
    01-2345678
    +
    fax:
    02-3456789
    +
    email:
    johndoe@someemail.com
    +
    + + diff --git a/working-examples/failure-css-positioning/index.html b/working-examples/failure-css-positioning/index.html new file mode 100644 index 0000000000..dca325389a --- /dev/null +++ b/working-examples/failure-css-positioning/index.html @@ -0,0 +1,78 @@ + + + + +Improper use of CSS to create a tabular layout + + + +

    The tablular layout in this example was created via CSS. This demonstrates a +Failure due to changing the meaning of content by positioning information with CSS since the reading order of the document can not be +programmatically determined. If CSS is turned off, this content will not +render properly

    +
    + Products + Locations + Telephones + Computers + Portable MP3 Players + Wisconsin + Idaho +
    + + \ No newline at end of file diff --git a/working-examples/failure-css-positioning/styles-removed.html b/working-examples/failure-css-positioning/styles-removed.html new file mode 100644 index 0000000000..b783bd395a --- /dev/null +++ b/working-examples/failure-css-positioning/styles-removed.html @@ -0,0 +1,26 @@ + + + + +Improper use of CSS to create a tabular layout + + + +

    Simulated removal of CSS to demonstrate improper use of CSS to create a tabular layout

    +

    The tablular layout in this example was created via CSS. In this example the +style information has been removed from the document. This demonstrates a +Failure due to changing the meaning of content by positioning information with CSS since the reading order of the document can not be +programmatically determined.

    +
    + Products + Locations + Telephones + Computers + Portable MP3 Players + Wisconsin + Idaho +
    + + \ No newline at end of file diff --git a/working-examples/failure-table-headers-incorrect-association/index.html b/working-examples/failure-table-headers-incorrect-association/index.html new file mode 100644 index 0000000000..456855e27b --- /dev/null +++ b/working-examples/failure-table-headers-incorrect-association/index.html @@ -0,0 +1,46 @@ + + + + + + Failure of Success Criterion 1.3.1 for incorrectly associating table headers and content via the headers and id attributes - example + + + + + + + + + + +

    Table incorrectly associating headers attributes in table content (td) to table headers (th)

    + + + + + + + + + + + + + + + + + + + + + + + +
    HomeworkExamsProjects
    12Final12Final
    15%15%15%20%10%10%15%
    + + + diff --git a/working-examples/failure-td-not-th/index.html b/working-examples/failure-td-not-th/index.html new file mode 100644 index 0000000000..72f4061cc4 --- /dev/null +++ b/working-examples/failure-td-not-th/index.html @@ -0,0 +1,64 @@ + + + + + + + Failure of Success Criterion 1.3.1 for not correctly marking up table headers - example 2 + + + + + + + + + + +

    Table using td instead of th for headers

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    NameAgeHeight (cm)Weight (kg)
    Linda33 + 169 + 59 +
    Jack3718474
    Kira812021
    Daniel37914
    + + + + + diff --git a/working-examples/flash-accessible-name-for-form_components-as2/accessible_name_for_form_components_as2.fla b/working-examples/flash-accessible-name-for-form_components-as2/accessible_name_for_form_components_as2.fla new file mode 100644 index 0000000000..cc948ca6d1 Binary files /dev/null and b/working-examples/flash-accessible-name-for-form_components-as2/accessible_name_for_form_components_as2.fla differ diff --git a/working-examples/flash-accessible-name-for-form_components-as2/accessible_name_for_form_components_as2.swf b/working-examples/flash-accessible-name-for-form_components-as2/accessible_name_for_form_components_as2.swf new file mode 100644 index 0000000000..90a6646040 Binary files /dev/null and b/working-examples/flash-accessible-name-for-form_components-as2/accessible_name_for_form_components_as2.swf differ diff --git a/working-examples/flash-accessible-name-for-form_components-as2/index.html b/working-examples/flash-accessible-name-for-form_components-as2/index.html new file mode 100644 index 0000000000..c4b1ddd697 --- /dev/null +++ b/working-examples/flash-accessible-name-for-form_components-as2/index.html @@ -0,0 +1,319 @@ + + + + +accessible_name_for_form_components_as2 + + + + + + + + + + diff --git a/working-examples/flash-accessible-name-for-form_components-as3/accessible_name_for_form_components_as3.fla b/working-examples/flash-accessible-name-for-form_components-as3/accessible_name_for_form_components_as3.fla new file mode 100644 index 0000000000..0ab4d80bb5 Binary files /dev/null and b/working-examples/flash-accessible-name-for-form_components-as3/accessible_name_for_form_components_as3.fla differ diff --git a/working-examples/flash-accessible-name-for-form_components-as3/accessible_name_for_form_components_as3.swf b/working-examples/flash-accessible-name-for-form_components-as3/accessible_name_for_form_components_as3.swf new file mode 100644 index 0000000000..07e2a718f0 Binary files /dev/null and b/working-examples/flash-accessible-name-for-form_components-as3/accessible_name_for_form_components_as3.swf differ diff --git a/working-examples/flash-accessible-name-for-form_components-as3/index.html b/working-examples/flash-accessible-name-for-form_components-as3/index.html new file mode 100644 index 0000000000..b41f749717 --- /dev/null +++ b/working-examples/flash-accessible-name-for-form_components-as3/index.html @@ -0,0 +1,319 @@ + + + + +accessible_name_for_form_components_as3 + + + + + + + + + + diff --git a/working-examples/flash-adding-captions-to-video/SkinUnderPlayCaption.swf b/working-examples/flash-adding-captions-to-video/SkinUnderPlayCaption.swf new file mode 100644 index 0000000000..5be0592293 Binary files /dev/null and b/working-examples/flash-adding-captions-to-video/SkinUnderPlayCaption.swf differ diff --git a/working-examples/flash-adding-captions-to-video/adding_captions_to_Flash_video_as3.swf b/working-examples/flash-adding-captions-to-video/adding_captions_to_Flash_video_as3.swf new file mode 100644 index 0000000000..454f9c78d4 Binary files /dev/null and b/working-examples/flash-adding-captions-to-video/adding_captions_to_Flash_video_as3.swf differ diff --git a/working-examples/flash-adding-captions-to-video/adding_captions_to_Flash_video_as3.zip b/working-examples/flash-adding-captions-to-video/adding_captions_to_Flash_video_as3.zip new file mode 100644 index 0000000000..7696614e4d Binary files /dev/null and b/working-examples/flash-adding-captions-to-video/adding_captions_to_Flash_video_as3.zip differ diff --git a/working-examples/flash-adding-captions-to-video/captions.xml b/working-examples/flash-adding-captions-to-video/captions.xml new file mode 100644 index 0000000000..fe52e238c5 --- /dev/null +++ b/working-examples/flash-adding-captions-to-video/captions.xml @@ -0,0 +1,28 @@ + + + + + + + + +

    Keyboard Trap Fix Example

    +
    +

    Donec eu arcu ipsum, eu molestie est. Curabitur quis enim eu libero scelerisque elementum. Vestibulum eget arcu facilisis nunc sodales porta sit amet sed mi. Suspendisse potenti. Fusce diam urna, elementum ut sagittis ut, vestibulum placerat ante. Etiam et lorem diam, rhoncus ultrices ligula. Praesent lorem justo, facilisis in commodo et, facilisis et diam. Donec sed libero id nisi scelerisque laoreet. Pellentesque ornare malesuada mollis. Nunc nunc nisi, imperdiet in elementum quis, ullamcorper et ante. Quisque eleifend viverra erat ut gravida. Mauris consequat ligula vel felis dignissim eget tincidunt tortor pharetra. Sed ultricies mi est, a venenatis purus. Morbi arcu lorem, vehicula aliquet blandit sit amet, volutpat ut orci.

    +

    The following Flash movie automatically generates invisible links before and after the flash movie, allowing keyboard focus to move out of the Flash content.

    +
    + + + + + + + + + + Get Adobe Flash player + + + + + + +
    +
    +
    +

    Ut vel nibh ut nisl gravida malesuada. Donec ultrices, velit quis vestibulum ornare, nisi lorem porta nisl, non ultrices sem lacus porttitor neque. Aenean at hendrerit erat. Fusce quis neque magna, at adipiscing felis. Vivamus sit amet lorem vel quam lobortis sagittis. Nunc sit amet justo vel nulla rutrum cursus. Suspendisse mauris elit, ullamcorper sit amet imperdiet vel, ullamcorper ut lectus. Vivamus sodales sollicitudin condimentum. Nulla tincidunt augue sit amet dolor tincidunt viverra. Pellentesque ullamcorper erat eleifend tellus luctus vel tristique eros pellentesque. Sed faucibus congue metus non viverra. Nunc sagittis ante porttitor nisl euismod euismod. Ut in lorem risus. Maecenas porttitor orci in ligula rutrum facilisis.

    +

    The following Flash movie uses existing links in the document to move focus to when (shift) tabbing out of the Flash content. The existing links are defined by placing special classnames on the Flash object.

    +
    + + + + + + + + + + Get Adobe Flash player + + + + + +
    +

    Donec eu arcu ipsum, eu molestie est. Curabitur quis enim eu libero scelerisque elementum. Vestibulum eget arcu facilisis nunc sodales porta sit amet sed mi. Suspendisse potenti. Fusce diam urna, elementum ut sagittis ut, vestibulum placerat ante. Etiam et lorem diam, rhoncus ultrices ligula. Praesent lorem justo, facilisis in commodo et, facilisis et diam. Donec sed libero id nisi scelerisque laoreet. Pellentesque ornare malesuada mollis. Nunc nunc nisi, imperdiet in elementum quis, ullamcorper et ante. Quisque eleifend viverra erat ut gravida. Mauris consequat ligula vel felis dignissim eget tincidunt tortor pharetra. Sed ultricies mi est, a venenatis purus. Morbi arcu lorem, vehicula aliquet blandit sit amet, volutpat ut orci.

    +
    + + + diff --git a/working-examples/flash-keyboard-trap-fix-custom/keyboard_trap_fix_custom_as3.swf b/working-examples/flash-keyboard-trap-fix-custom/keyboard_trap_fix_custom_as3.swf new file mode 100644 index 0000000000..8332f25d9d Binary files /dev/null and b/working-examples/flash-keyboard-trap-fix-custom/keyboard_trap_fix_custom_as3.swf differ diff --git a/working-examples/flash-keyboard-trap-fix-custom/keyboard_trap_fix_custom_as3.zip b/working-examples/flash-keyboard-trap-fix-custom/keyboard_trap_fix_custom_as3.zip new file mode 100644 index 0000000000..080dd50a6b Binary files /dev/null and b/working-examples/flash-keyboard-trap-fix-custom/keyboard_trap_fix_custom_as3.zip differ diff --git a/working-examples/flash-keyboard-trap-fix-custom/swfobject_2_1.js b/working-examples/flash-keyboard-trap-fix-custom/swfobject_2_1.js new file mode 100644 index 0000000000..08fb27000e --- /dev/null +++ b/working-examples/flash-keyboard-trap-fix-custom/swfobject_2_1.js @@ -0,0 +1,5 @@ +/* SWFObject v2.1 + Copyright (c) 2007-2008 Geoff Stearns, Michael Williams, and Bobby van der Sluis + This software is released under the MIT License +*/ +var swfobject=function(){var b="undefined",Q="object",n="Shockwave Flash",p="ShockwaveFlash.ShockwaveFlash",P="application/x-shockwave-flash",m="SWFObjectExprInst",j=window,K=document,T=navigator,o=[],N=[],i=[],d=[],J,Z=null,M=null,l=null,e=false,A=false;var h=function(){var v=typeof K.getElementById!=b&&typeof K.getElementsByTagName!=b&&typeof K.createElement!=b,AC=[0,0,0],x=null;if(typeof T.plugins!=b&&typeof T.plugins[n]==Q){x=T.plugins[n].description;if(x&&!(typeof T.mimeTypes!=b&&T.mimeTypes[P]&&!T.mimeTypes[P].enabledPlugin)){x=x.replace(/^.*\s+(\S+\s+\S+$)/,"$1");AC[0]=parseInt(x.replace(/^(.*)\..*$/,"$1"),10);AC[1]=parseInt(x.replace(/^.*\.(.*)\s.*$/,"$1"),10);AC[2]=/r/.test(x)?parseInt(x.replace(/^.*r(.*)$/,"$1"),10):0}}else{if(typeof j.ActiveXObject!=b){var y=null,AB=false;try{y=new ActiveXObject(p+".7")}catch(t){try{y=new ActiveXObject(p+".6");AC=[6,0,21];y.AllowScriptAccess="always"}catch(t){if(AC[0]==6){AB=true}}if(!AB){try{y=new ActiveXObject(p)}catch(t){}}}if(!AB&&y){try{x=y.GetVariable("$version");if(x){x=x.split(" ")[1].split(",");AC=[parseInt(x[0],10),parseInt(x[1],10),parseInt(x[2],10)]}}catch(t){}}}}var AD=T.userAgent.toLowerCase(),r=T.platform.toLowerCase(),AA=/webkit/.test(AD)?parseFloat(AD.replace(/^.*webkit\/(\d+(\.\d+)?).*$/,"$1")):false,q=false,z=r?/win/.test(r):/win/.test(AD),w=r?/mac/.test(r):/mac/.test(AD);/*@cc_on q=true;@if(@_win32)z=true;@elif(@_mac)w=true;@end@*/return{w3cdom:v,pv:AC,webkit:AA,ie:q,win:z,mac:w}}();var L=function(){if(!h.w3cdom){return }f(H);if(h.ie&&h.win){try{K.write(" + + + +

    Flash content with English language settings:

    + + + + + + + + + + + + diff --git a/working-examples/flash-language-page/language_es.html b/working-examples/flash-language-page/language_es.html new file mode 100644 index 0000000000..1092cf781b --- /dev/null +++ b/working-examples/flash-language-page/language_es.html @@ -0,0 +1,27 @@ + + + + + Flash Languages Examples - Spanish + + + + +

    Flash content with Spanish language settings:

    + + + + + + + + + + + + diff --git a/working-examples/flash-language-page/language_fr.html b/working-examples/flash-language-page/language_fr.html new file mode 100644 index 0000000000..b4aefa99dd --- /dev/null +++ b/working-examples/flash-language-page/language_fr.html @@ -0,0 +1,27 @@ + + + + + Flash Languages Examples - French + + + + +

    Flash content with Spanish language settings:

    + + + + + + + + + + + + diff --git a/working-examples/flash-language-page/languages.fla b/working-examples/flash-language-page/languages.fla new file mode 100644 index 0000000000..7912f0b6a5 Binary files /dev/null and b/working-examples/flash-language-page/languages.fla differ diff --git a/working-examples/flash-language-page/languages.swf b/working-examples/flash-language-page/languages.swf new file mode 100644 index 0000000000..1d84aa2809 Binary files /dev/null and b/working-examples/flash-language-page/languages.swf differ diff --git a/working-examples/flash-language-page/swfobject.js b/working-examples/flash-language-page/swfobject.js new file mode 100644 index 0000000000..8eafe9dd83 --- /dev/null +++ b/working-examples/flash-language-page/swfobject.js @@ -0,0 +1,4 @@ +/* SWFObject v2.2 + is released under the MIT License +*/ +var swfobject=function(){var D="undefined",r="object",S="Shockwave Flash",W="ShockwaveFlash.ShockwaveFlash",q="application/x-shockwave-flash",R="SWFObjectExprInst",x="onreadystatechange",O=window,j=document,t=navigator,T=false,U=[h],o=[],N=[],I=[],l,Q,E,B,J=false,a=false,n,G,m=true,M=function(){var aa=typeof j.getElementById!=D&&typeof j.getElementsByTagName!=D&&typeof j.createElement!=D,ah=t.userAgent.toLowerCase(),Y=t.platform.toLowerCase(),ae=Y?/win/.test(Y):/win/.test(ah),ac=Y?/mac/.test(Y):/mac/.test(ah),af=/webkit/.test(ah)?parseFloat(ah.replace(/^.*webkit\/(\d+(\.\d+)?).*$/,"$1")):false,X=!+"\v1",ag=[0,0,0],ab=null;if(typeof t.plugins!=D&&typeof t.plugins[S]==r){ab=t.plugins[S].description;if(ab&&!(typeof t.mimeTypes!=D&&t.mimeTypes[q]&&!t.mimeTypes[q].enabledPlugin)){T=true;X=false;ab=ab.replace(/^.*\s+(\S+\s+\S+$)/,"$1");ag[0]=parseInt(ab.replace(/^(.*)\..*$/,"$1"),10);ag[1]=parseInt(ab.replace(/^.*\.(.*)\s.*$/,"$1"),10);ag[2]=/[a-zA-Z]/.test(ab)?parseInt(ab.replace(/^.*[a-zA-Z]+(.*)$/,"$1"),10):0}}else{if(typeof O.ActiveXObject!=D){try{var ad=new ActiveXObject(W);if(ad){ab=ad.GetVariable("$version");if(ab){X=true;ab=ab.split(" ")[1].split(",");ag=[parseInt(ab[0],10),parseInt(ab[1],10),parseInt(ab[2],10)]}}}catch(Z){}}}return{w3:aa,pv:ag,wk:af,ie:X,win:ae,mac:ac}}(),k=function(){if(!M.w3){return}if((typeof j.readyState!=D&&j.readyState=="complete")||(typeof j.readyState==D&&(j.getElementsByTagName("body")[0]||j.body))){f()}if(!J){if(typeof j.addEventListener!=D){j.addEventListener("DOMContentLoaded",f,false)}if(M.ie&&M.win){j.attachEvent(x,function(){if(j.readyState=="complete"){j.detachEvent(x,arguments.callee);f()}});if(O==top){(function(){if(J){return}try{j.documentElement.doScroll("left")}catch(X){setTimeout(arguments.callee,0);return}f()})()}}if(M.wk){(function(){if(J){return}if(!/loaded|complete/.test(j.readyState)){setTimeout(arguments.callee,0);return}f()})()}s(f)}}();function f(){if(J){return}try{var Z=j.getElementsByTagName("body")[0].appendChild(C("span"));Z.parentNode.removeChild(Z)}catch(aa){return}J=true;var X=U.length;for(var Y=0;Y0){for(var af=0;af0){var ae=c(Y);if(ae){if(F(o[af].swfVersion)&&!(M.wk&&M.wk<312)){w(Y,true);if(ab){aa.success=true;aa.ref=z(Y);ab(aa)}}else{if(o[af].expressInstall&&A()){var ai={};ai.data=o[af].expressInstall;ai.width=ae.getAttribute("width")||"0";ai.height=ae.getAttribute("height")||"0";if(ae.getAttribute("class")){ai.styleclass=ae.getAttribute("class")}if(ae.getAttribute("align")){ai.align=ae.getAttribute("align")}var ah={};var X=ae.getElementsByTagName("param");var ac=X.length;for(var ad=0;ad'}}aa.outerHTML='"+af+"";N[N.length]=ai.id;X=c(ai.id)}else{var Z=C(r);Z.setAttribute("type",q);for(var ac in ai){if(ai[ac]!=Object.prototype[ac]){if(ac.toLowerCase()=="styleclass"){Z.setAttribute("class",ai[ac])}else{if(ac.toLowerCase()!="classid"){Z.setAttribute(ac,ai[ac])}}}}for(var ab in ag){if(ag[ab]!=Object.prototype[ab]&&ab.toLowerCase()!="movie"){e(Z,ab,ag[ab])}}aa.parentNode.replaceChild(Z,aa);X=Z}}return X}function e(Z,X,Y){var aa=C("param");aa.setAttribute("name",X);aa.setAttribute("value",Y);Z.appendChild(aa)}function y(Y){var X=c(Y);if(X&&X.nodeName=="OBJECT"){if(M.ie&&M.win){X.style.display="none";(function(){if(X.readyState==4){b(Y)}else{setTimeout(arguments.callee,10)}})()}else{X.parentNode.removeChild(X)}}}function b(Z){var Y=c(Z);if(Y){for(var X in Y){if(typeof Y[X]=="function"){Y[X]=null}}Y.parentNode.removeChild(Y)}}function c(Z){var X=null;try{X=j.getElementById(Z)}catch(Y){}return X}function C(X){return j.createElement(X)}function i(Z,X,Y){Z.attachEvent(X,Y);I[I.length]=[Z,X,Y]}function F(Z){var Y=M.pv,X=Z.split(".");X[0]=parseInt(X[0],10);X[1]=parseInt(X[1],10)||0;X[2]=parseInt(X[2],10)||0;return(Y[0]>X[0]||(Y[0]==X[0]&&Y[1]>X[1])||(Y[0]==X[0]&&Y[1]==X[1]&&Y[2]>=X[2]))?true:false}function v(ac,Y,ad,ab){if(M.ie&&M.mac){return}var aa=j.getElementsByTagName("head")[0];if(!aa){return}var X=(ad&&typeof ad=="string")?ad:"screen";if(ab){n=null;G=null}if(!n||G!=X){var Z=C("style");Z.setAttribute("type","text/css");Z.setAttribute("media",X);n=aa.appendChild(Z);if(M.ie&&M.win&&typeof j.styleSheets!=D&&j.styleSheets.length>0){n=j.styleSheets[j.styleSheets.length-1]}G=X}if(M.ie&&M.win){if(n&&typeof n.addRule==r){n.addRule(ac,Y)}}else{if(n&&typeof j.createTextNode!=D){n.appendChild(j.createTextNode(ac+" {"+Y+"}"))}}}function w(Z,X){if(!m){return}var Y=X?"visible":"hidden";if(J&&c(Z)){c(Z).style.visibility=Y}else{v("#"+Z,"visibility:"+Y)}}function L(Y){var Z=/[\\\"<>\.;]/;var X=Z.exec(Y)!=null;return X&&typeof encodeURIComponent!=D?encodeURIComponent(Y):Y}var d=function(){if(M.ie&&M.win){window.attachEvent("onunload",function(){var ac=I.length;for(var ab=0;ab + + + +long_description_for_image_as3 + + + + + + + + + + + diff --git a/working-examples/flash-long-description-for-image/long_description_for_image_as3.fla b/working-examples/flash-long-description-for-image/long_description_for_image_as3.fla new file mode 100644 index 0000000000..18b1e9a200 Binary files /dev/null and b/working-examples/flash-long-description-for-image/long_description_for_image_as3.fla differ diff --git a/working-examples/flash-long-description-for-image/long_description_for_image_as3.swf b/working-examples/flash-long-description-for-image/long_description_for_image_as3.swf new file mode 100644 index 0000000000..e0a4ca470a Binary files /dev/null and b/working-examples/flash-long-description-for-image/long_description_for_image_as3.swf differ diff --git a/working-examples/flash-pause-scrolling/index.html b/working-examples/flash-pause-scrolling/index.html new file mode 100644 index 0000000000..ec9a297df7 --- /dev/null +++ b/working-examples/flash-pause-scrolling/index.html @@ -0,0 +1,319 @@ + + + + +pause_scrolling_as3 + + + + + + + + + + diff --git a/working-examples/flash-pause-scrolling/pause_scrolling_as3.fla b/working-examples/flash-pause-scrolling/pause_scrolling_as3.fla new file mode 100644 index 0000000000..6152d38dac Binary files /dev/null and b/working-examples/flash-pause-scrolling/pause_scrolling_as3.fla differ diff --git a/working-examples/flash-pause-scrolling/pause_scrolling_as3.swf b/working-examples/flash-pause-scrolling/pause_scrolling_as3.swf new file mode 100644 index 0000000000..89608290de Binary files /dev/null and b/working-examples/flash-pause-scrolling/pause_scrolling_as3.swf differ diff --git a/working-examples/flash-radio-button-group/index.html b/working-examples/flash-radio-button-group/index.html new file mode 100644 index 0000000000..3e112bccb9 --- /dev/null +++ b/working-examples/flash-radio-button-group/index.html @@ -0,0 +1,319 @@ + + + + +radio_button_group_as3 + + + + + + + + + + diff --git a/working-examples/flash-radio-button-group/radio_button_group_as3.fla b/working-examples/flash-radio-button-group/radio_button_group_as3.fla new file mode 100644 index 0000000000..8c094c3925 Binary files /dev/null and b/working-examples/flash-radio-button-group/radio_button_group_as3.fla differ diff --git a/working-examples/flash-radio-button-group/radio_button_group_as3.swf b/working-examples/flash-radio-button-group/radio_button_group_as3.swf new file mode 100644 index 0000000000..23267bfc8e Binary files /dev/null and b/working-examples/flash-radio-button-group/radio_button_group_as3.swf differ diff --git a/working-examples/flash-redundant-event-handlers/index.html b/working-examples/flash-redundant-event-handlers/index.html new file mode 100644 index 0000000000..b3e5941528 --- /dev/null +++ b/working-examples/flash-redundant-event-handlers/index.html @@ -0,0 +1,322 @@ + + + + +redundant_event_handlers_as3 + + + + + + + + + + + diff --git a/working-examples/flash-redundant-event-handlers/redundant_event_handlers_as3.fla b/working-examples/flash-redundant-event-handlers/redundant_event_handlers_as3.fla new file mode 100644 index 0000000000..b680c24b65 Binary files /dev/null and b/working-examples/flash-redundant-event-handlers/redundant_event_handlers_as3.fla differ diff --git a/working-examples/flash-redundant-event-handlers/redundant_event_handlers_as3.swf b/working-examples/flash-redundant-event-handlers/redundant_event_handlers_as3.swf new file mode 100644 index 0000000000..a770d05cfe Binary files /dev/null and b/working-examples/flash-redundant-event-handlers/redundant_event_handlers_as3.swf differ diff --git a/working-examples/flash-required_form_fields/index.html b/working-examples/flash-required_form_fields/index.html new file mode 100644 index 0000000000..270c1cd626 --- /dev/null +++ b/working-examples/flash-required_form_fields/index.html @@ -0,0 +1,322 @@ + + + + +required_form_fields_as2 + + + + + + + + + + + diff --git a/working-examples/flash-required_form_fields/required_form_fields_as2.fla b/working-examples/flash-required_form_fields/required_form_fields_as2.fla new file mode 100644 index 0000000000..29b293654b Binary files /dev/null and b/working-examples/flash-required_form_fields/required_form_fields_as2.fla differ diff --git a/working-examples/flash-required_form_fields/required_form_fields_as2.swf b/working-examples/flash-required_form_fields/required_form_fields_as2.swf new file mode 100644 index 0000000000..74f6e7635a Binary files /dev/null and b/working-examples/flash-required_form_fields/required_form_fields_as2.swf differ diff --git a/working-examples/flash-scale-movie-dimensions-on-text-resize/index.html b/working-examples/flash-scale-movie-dimensions-on-text-resize/index.html new file mode 100644 index 0000000000..752bd8e64d --- /dev/null +++ b/working-examples/flash-scale-movie-dimensions-on-text-resize/index.html @@ -0,0 +1,25 @@ + + + + +Flash Resize example + + + + + + +

    Flash Resize Demonstration

    +

    When the bowser's text size is changed, the Flash movie will be resized accordingly.

    +

    Flash needs to be installed for this example to work

    + + diff --git a/working-examples/flash-scale-movie-dimensions-on-text-resize/scale_movie_dimensions_on_text_resize_as3.fla b/working-examples/flash-scale-movie-dimensions-on-text-resize/scale_movie_dimensions_on_text_resize_as3.fla new file mode 100644 index 0000000000..1567341cdf Binary files /dev/null and b/working-examples/flash-scale-movie-dimensions-on-text-resize/scale_movie_dimensions_on_text_resize_as3.fla differ diff --git a/working-examples/flash-scale-movie-dimensions-on-text-resize/scale_movie_dimensions_on_text_resize_as3.swf b/working-examples/flash-scale-movie-dimensions-on-text-resize/scale_movie_dimensions_on_text_resize_as3.swf new file mode 100644 index 0000000000..4ec614619e Binary files /dev/null and b/working-examples/flash-scale-movie-dimensions-on-text-resize/scale_movie_dimensions_on_text_resize_as3.swf differ diff --git a/working-examples/flash-scale-movie-dimensions-on-text-resize/swfobject/expressInstall.swf b/working-examples/flash-scale-movie-dimensions-on-text-resize/swfobject/expressInstall.swf new file mode 100644 index 0000000000..0fbf8fca96 Binary files /dev/null and b/working-examples/flash-scale-movie-dimensions-on-text-resize/swfobject/expressInstall.swf differ diff --git a/working-examples/flash-scale-movie-dimensions-on-text-resize/swfobject/index.html b/working-examples/flash-scale-movie-dimensions-on-text-resize/swfobject/index.html new file mode 100644 index 0000000000..3264034ae4 --- /dev/null +++ b/working-examples/flash-scale-movie-dimensions-on-text-resize/swfobject/index.html @@ -0,0 +1,28 @@ + + + + SWFObject 2 static publishing example page + + + + + +
    + + + + + +
    +

    Alternative content

    +

    Get Adobe Flash player

    +
    + +     + +     +
    + + diff --git a/working-examples/flash-scale-movie-dimensions-on-text-resize/swfobject/index_dynamic.html b/working-examples/flash-scale-movie-dimensions-on-text-resize/swfobject/index_dynamic.html new file mode 100644 index 0000000000..3c36217845 --- /dev/null +++ b/working-examples/flash-scale-movie-dimensions-on-text-resize/swfobject/index_dynamic.html @@ -0,0 +1,17 @@ + + + + SWFObject 2 dynamic publishing example page + + + + + +
    +

    Alternative content

    +

    Get Adobe Flash player

    +
    + + diff --git a/working-examples/flash-scale-movie-dimensions-on-text-resize/swfobject/src/expressInstall.as b/working-examples/flash-scale-movie-dimensions-on-text-resize/swfobject/src/expressInstall.as new file mode 100644 index 0000000000..ce5973f759 --- /dev/null +++ b/working-examples/flash-scale-movie-dimensions-on-text-resize/swfobject/src/expressInstall.as @@ -0,0 +1,70 @@ +/* SWFObject v2.2 is released under the MIT License + Express Install Copyright (c) 2007-2008 Adobe Systems Incorporated and its licensors. All Rights Reserved. +*/ + +System.security.allowDomain("fpdownload.macromedia.com"); + +var time = 0; +var timeOut = 5; // in seconds +var delay = 10; // in milliseconds +var int_id = setInterval(checkLoaded, delay); +var old_si = null; +var loaderClip = this.createEmptyMovieClip("loaderClip", 0); +var updateSWF = "http://fpdownload.macromedia.com/pub/flashplayer/update/current/swf/autoUpdater.swf?" + Math.random(); +loaderClip.loadMovie(updateSWF); + +function checkLoaded(){ + time += delay / 1000; + if (time > timeOut) { + // updater did not load in time, abort load and force alternative content + clearInterval(int_id); + loaderClip.unloadMovie(); + loadTimeOut(); + } + else if (loaderClip.startInstall.toString() == "[type Function]") { + // updater has loaded successfully AND has determined that it can do the express install + if (old_si == null) { + old_si = loaderClip.startInstall; + loaderClip.startInstall = function() { + clearInterval(int_id); + old_si(); + } + loadComplete(); + } + } +} + +function loadTimeOut() { + callbackSWFObject(); +} + +function callbackSWFObject() { + getURL("javascript:swfobject.expressInstallCallback();"); +} + +function loadComplete() { + loaderClip.redirectURL = _level0.MMredirectURL; + loaderClip.MMplayerType = _level0.MMplayerType; + loaderClip.MMdoctitle = _level0.MMdoctitle; + loaderClip.startUpdate(); +} + +function installStatus(statusValue) { + switch (statusValue) { + case "Download.Complete": + // Installation is complete. + // In most cases the browser window that this SWF is hosted in will be closed by the installer or otherwise it has to be closed manually by the end user. + // The Adobe Flash installer will attempt to reopen the browser window and reload the page containing the SWF. + break; + case "Download.Cancelled": + // The end user chose "NO" when prompted to install the new player. + // By default the SWFObject callback function is called to force alternative content. + callbackSWFObject(); + break; + case "Download.Failed": + // The end user failed to download the installer due to a network failure. + // By default the SWFObject callback function is called to force alternative content. + callbackSWFObject(); + break; + } +} diff --git a/working-examples/flash-scale-movie-dimensions-on-text-resize/swfobject/src/expressInstall.fla b/working-examples/flash-scale-movie-dimensions-on-text-resize/swfobject/src/expressInstall.fla new file mode 100644 index 0000000000..3784153b58 Binary files /dev/null and b/working-examples/flash-scale-movie-dimensions-on-text-resize/swfobject/src/expressInstall.fla differ diff --git a/working-examples/flash-scale-movie-dimensions-on-text-resize/swfobject/src/swfobject.js b/working-examples/flash-scale-movie-dimensions-on-text-resize/swfobject/src/swfobject.js new file mode 100644 index 0000000000..9378c8f756 --- /dev/null +++ b/working-examples/flash-scale-movie-dimensions-on-text-resize/swfobject/src/swfobject.js @@ -0,0 +1,777 @@ +/*! SWFObject v2.2 + is released under the MIT License +*/ + +var swfobject = function() { + + var UNDEF = "undefined", + OBJECT = "object", + SHOCKWAVE_FLASH = "Shockwave Flash", + SHOCKWAVE_FLASH_AX = "ShockwaveFlash.ShockwaveFlash", + FLASH_MIME_TYPE = "application/x-shockwave-flash", + EXPRESS_INSTALL_ID = "SWFObjectExprInst", + ON_READY_STATE_CHANGE = "onreadystatechange", + + win = window, + doc = document, + nav = navigator, + + plugin = false, + domLoadFnArr = [main], + regObjArr = [], + objIdArr = [], + listenersArr = [], + storedAltContent, + storedAltContentId, + storedCallbackFn, + storedCallbackObj, + isDomLoaded = false, + isExpressInstallActive = false, + dynamicStylesheet, + dynamicStylesheetMedia, + autoHideShow = true, + + /* Centralized function for browser feature detection + - User agent string detection is only used when no good alternative is possible + - Is executed directly for optimal performance + */ + ua = function() { + var w3cdom = typeof doc.getElementById != UNDEF && typeof doc.getElementsByTagName != UNDEF && typeof doc.createElement != UNDEF, + u = nav.userAgent.toLowerCase(), + p = nav.platform.toLowerCase(), + windows = p ? /win/.test(p) : /win/.test(u), + mac = p ? /mac/.test(p) : /mac/.test(u), + webkit = /webkit/.test(u) ? parseFloat(u.replace(/^.*webkit\/(\d+(\.\d+)?).*$/, "$1")) : false, // returns either the webkit version or false if not webkit + ie = !+"\v1", // feature detection based on Andrea Giammarchi's solution: http://webreflection.blogspot.com/2009/01/32-bytes-to-know-if-your-browser-is-ie.html + playerVersion = [0,0,0], + d = null; + if (typeof nav.plugins != UNDEF && typeof nav.plugins[SHOCKWAVE_FLASH] == OBJECT) { + d = nav.plugins[SHOCKWAVE_FLASH].description; + if (d && !(typeof nav.mimeTypes != UNDEF && nav.mimeTypes[FLASH_MIME_TYPE] && !nav.mimeTypes[FLASH_MIME_TYPE].enabledPlugin)) { // navigator.mimeTypes["application/x-shockwave-flash"].enabledPlugin indicates whether plug-ins are enabled or disabled in Safari 3+ + plugin = true; + ie = false; // cascaded feature detection for Internet Explorer + d = d.replace(/^.*\s+(\S+\s+\S+$)/, "$1"); + playerVersion[0] = parseInt(d.replace(/^(.*)\..*$/, "$1"), 10); + playerVersion[1] = parseInt(d.replace(/^.*\.(.*)\s.*$/, "$1"), 10); + playerVersion[2] = /[a-zA-Z]/.test(d) ? parseInt(d.replace(/^.*[a-zA-Z]+(.*)$/, "$1"), 10) : 0; + } + } + else if (typeof win.ActiveXObject != UNDEF) { + try { + var a = new ActiveXObject(SHOCKWAVE_FLASH_AX); + if (a) { // a will return null when ActiveX is disabled + d = a.GetVariable("$version"); + if (d) { + ie = true; // cascaded feature detection for Internet Explorer + d = d.split(" ")[1].split(","); + playerVersion = [parseInt(d[0], 10), parseInt(d[1], 10), parseInt(d[2], 10)]; + } + } + } + catch(e) {} + } + return { w3:w3cdom, pv:playerVersion, wk:webkit, ie:ie, win:windows, mac:mac }; + }(), + + /* Cross-browser onDomLoad + - Will fire an event as soon as the DOM of a web page is loaded + - Internet Explorer workaround based on Diego Perini's solution: http://javascript.nwbox.com/IEContentLoaded/ + - Regular onload serves as fallback + */ + onDomLoad = function() { + if (!ua.w3) { return; } + if ((typeof doc.readyState != UNDEF && doc.readyState == "complete") || (typeof doc.readyState == UNDEF && (doc.getElementsByTagName("body")[0] || doc.body))) { // function is fired after onload, e.g. when script is inserted dynamically + callDomLoadFunctions(); + } + if (!isDomLoaded) { + if (typeof doc.addEventListener != UNDEF) { + doc.addEventListener("DOMContentLoaded", callDomLoadFunctions, false); + } + if (ua.ie && ua.win) { + doc.attachEvent(ON_READY_STATE_CHANGE, function() { + if (doc.readyState == "complete") { + doc.detachEvent(ON_READY_STATE_CHANGE, arguments.callee); + callDomLoadFunctions(); + } + }); + if (win == top) { // if not inside an iframe + (function(){ + if (isDomLoaded) { return; } + try { + doc.documentElement.doScroll("left"); + } + catch(e) { + setTimeout(arguments.callee, 0); + return; + } + callDomLoadFunctions(); + })(); + } + } + if (ua.wk) { + (function(){ + if (isDomLoaded) { return; } + if (!/loaded|complete/.test(doc.readyState)) { + setTimeout(arguments.callee, 0); + return; + } + callDomLoadFunctions(); + })(); + } + addLoadEvent(callDomLoadFunctions); + } + }(); + + function callDomLoadFunctions() { + if (isDomLoaded) { return; } + try { // test if we can really add/remove elements to/from the DOM; we don't want to fire it too early + var t = doc.getElementsByTagName("body")[0].appendChild(createElement("span")); + t.parentNode.removeChild(t); + } + catch (e) { return; } + isDomLoaded = true; + var dl = domLoadFnArr.length; + for (var i = 0; i < dl; i++) { + domLoadFnArr[i](); + } + } + + function addDomLoadEvent(fn) { + if (isDomLoaded) { + fn(); + } + else { + domLoadFnArr[domLoadFnArr.length] = fn; // Array.push() is only available in IE5.5+ + } + } + + /* Cross-browser onload + - Based on James Edwards' solution: http://brothercake.com/site/resources/scripts/onload/ + - Will fire an event as soon as a web page including all of its assets are loaded + */ + function addLoadEvent(fn) { + if (typeof win.addEventListener != UNDEF) { + win.addEventListener("load", fn, false); + } + else if (typeof doc.addEventListener != UNDEF) { + doc.addEventListener("load", fn, false); + } + else if (typeof win.attachEvent != UNDEF) { + addListener(win, "onload", fn); + } + else if (typeof win.onload == "function") { + var fnOld = win.onload; + win.onload = function() { + fnOld(); + fn(); + }; + } + else { + win.onload = fn; + } + } + + /* Main function + - Will preferably execute onDomLoad, otherwise onload (as a fallback) + */ + function main() { + if (plugin) { + testPlayerVersion(); + } + else { + matchVersions(); + } + } + + /* Detect the Flash Player version for non-Internet Explorer browsers + - Detecting the plug-in version via the object element is more precise than using the plugins collection item's description: + a. Both release and build numbers can be detected + b. Avoid wrong descriptions by corrupt installers provided by Adobe + c. Avoid wrong descriptions by multiple Flash Player entries in the plugin Array, caused by incorrect browser imports + - Disadvantage of this method is that it depends on the availability of the DOM, while the plugins collection is immediately available + */ + function testPlayerVersion() { + var b = doc.getElementsByTagName("body")[0]; + var o = createElement(OBJECT); + o.setAttribute("type", FLASH_MIME_TYPE); + var t = b.appendChild(o); + if (t) { + var counter = 0; + (function(){ + if (typeof t.GetVariable != UNDEF) { + var d = t.GetVariable("$version"); + if (d) { + d = d.split(" ")[1].split(","); + ua.pv = [parseInt(d[0], 10), parseInt(d[1], 10), parseInt(d[2], 10)]; + } + } + else if (counter < 10) { + counter++; + setTimeout(arguments.callee, 10); + return; + } + b.removeChild(o); + t = null; + matchVersions(); + })(); + } + else { + matchVersions(); + } + } + + /* Perform Flash Player and SWF version matching; static publishing only + */ + function matchVersions() { + var rl = regObjArr.length; + if (rl > 0) { + for (var i = 0; i < rl; i++) { // for each registered object element + var id = regObjArr[i].id; + var cb = regObjArr[i].callbackFn; + var cbObj = {success:false, id:id}; + if (ua.pv[0] > 0) { + var obj = getElementById(id); + if (obj) { + if (hasPlayerVersion(regObjArr[i].swfVersion) && !(ua.wk && ua.wk < 312)) { // Flash Player version >= published SWF version: Houston, we have a match! + setVisibility(id, true); + if (cb) { + cbObj.success = true; + cbObj.ref = getObjectById(id); + cb(cbObj); + } + } + else if (regObjArr[i].expressInstall && canExpressInstall()) { // show the Adobe Express Install dialog if set by the web page author and if supported + var att = {}; + att.data = regObjArr[i].expressInstall; + att.width = obj.getAttribute("width") || "0"; + att.height = obj.getAttribute("height") || "0"; + if (obj.getAttribute("class")) { att.styleclass = obj.getAttribute("class"); } + if (obj.getAttribute("align")) { att.align = obj.getAttribute("align"); } + // parse HTML object param element's name-value pairs + var par = {}; + var p = obj.getElementsByTagName("param"); + var pl = p.length; + for (var j = 0; j < pl; j++) { + if (p[j].getAttribute("name").toLowerCase() != "movie") { + par[p[j].getAttribute("name")] = p[j].getAttribute("value"); + } + } + showExpressInstall(att, par, id, cb); + } + else { // Flash Player and SWF version mismatch or an older Webkit engine that ignores the HTML object element's nested param elements: display alternative content instead of SWF + displayAltContent(obj); + if (cb) { cb(cbObj); } + } + } + } + else { // if no Flash Player is installed or the fp version cannot be detected we let the HTML object element do its job (either show a SWF or alternative content) + setVisibility(id, true); + if (cb) { + var o = getObjectById(id); // test whether there is an HTML object element or not + if (o && typeof o.SetVariable != UNDEF) { + cbObj.success = true; + cbObj.ref = o; + } + cb(cbObj); + } + } + } + } + } + + function getObjectById(objectIdStr) { + var r = null; + var o = getElementById(objectIdStr); + if (o && o.nodeName == "OBJECT") { + if (typeof o.SetVariable != UNDEF) { + r = o; + } + else { + var n = o.getElementsByTagName(OBJECT)[0]; + if (n) { + r = n; + } + } + } + return r; + } + + /* Requirements for Adobe Express Install + - only one instance can be active at a time + - fp 6.0.65 or higher + - Win/Mac OS only + - no Webkit engines older than version 312 + */ + function canExpressInstall() { + return !isExpressInstallActive && hasPlayerVersion("6.0.65") && (ua.win || ua.mac) && !(ua.wk && ua.wk < 312); + } + + /* Show the Adobe Express Install dialog + - Reference: http://www.adobe.com/cfusion/knowledgebase/index.cfm?id=6a253b75 + */ + function showExpressInstall(att, par, replaceElemIdStr, callbackFn) { + isExpressInstallActive = true; + storedCallbackFn = callbackFn || null; + storedCallbackObj = {success:false, id:replaceElemIdStr}; + var obj = getElementById(replaceElemIdStr); + if (obj) { + if (obj.nodeName == "OBJECT") { // static publishing + storedAltContent = abstractAltContent(obj); + storedAltContentId = null; + } + else { // dynamic publishing + storedAltContent = obj; + storedAltContentId = replaceElemIdStr; + } + att.id = EXPRESS_INSTALL_ID; + if (typeof att.width == UNDEF || (!/%$/.test(att.width) && parseInt(att.width, 10) < 310)) { att.width = "310"; } + if (typeof att.height == UNDEF || (!/%$/.test(att.height) && parseInt(att.height, 10) < 137)) { att.height = "137"; } + doc.title = doc.title.slice(0, 47) + " - Flash Player Installation"; + var pt = ua.ie && ua.win ? "ActiveX" : "PlugIn", + fv = "MMredirectURL=" + win.location.toString().replace(/&/g,"%26") + "&MMplayerType=" + pt + "&MMdoctitle=" + doc.title; + if (typeof par.flashvars != UNDEF) { + par.flashvars += "&" + fv; + } + else { + par.flashvars = fv; + } + // IE only: when a SWF is loading (AND: not available in cache) wait for the readyState of the object element to become 4 before removing it, + // because you cannot properly cancel a loading SWF file without breaking browser load references, also obj.onreadystatechange doesn't work + if (ua.ie && ua.win && obj.readyState != 4) { + var newObj = createElement("div"); + replaceElemIdStr += "SWFObjectNew"; + newObj.setAttribute("id", replaceElemIdStr); + obj.parentNode.insertBefore(newObj, obj); // insert placeholder div that will be replaced by the object element that loads expressinstall.swf + obj.style.display = "none"; + (function(){ + if (obj.readyState == 4) { + obj.parentNode.removeChild(obj); + } + else { + setTimeout(arguments.callee, 10); + } + })(); + } + createSWF(att, par, replaceElemIdStr); + } + } + + /* Functions to abstract and display alternative content + */ + function displayAltContent(obj) { + if (ua.ie && ua.win && obj.readyState != 4) { + // IE only: when a SWF is loading (AND: not available in cache) wait for the readyState of the object element to become 4 before removing it, + // because you cannot properly cancel a loading SWF file without breaking browser load references, also obj.onreadystatechange doesn't work + var el = createElement("div"); + obj.parentNode.insertBefore(el, obj); // insert placeholder div that will be replaced by the alternative content + el.parentNode.replaceChild(abstractAltContent(obj), el); + obj.style.display = "none"; + (function(){ + if (obj.readyState == 4) { + obj.parentNode.removeChild(obj); + } + else { + setTimeout(arguments.callee, 10); + } + })(); + } + else { + obj.parentNode.replaceChild(abstractAltContent(obj), obj); + } + } + + function abstractAltContent(obj) { + var ac = createElement("div"); + if (ua.win && ua.ie) { + ac.innerHTML = obj.innerHTML; + } + else { + var nestedObj = obj.getElementsByTagName(OBJECT)[0]; + if (nestedObj) { + var c = nestedObj.childNodes; + if (c) { + var cl = c.length; + for (var i = 0; i < cl; i++) { + if (!(c[i].nodeType == 1 && c[i].nodeName == "PARAM") && !(c[i].nodeType == 8)) { + ac.appendChild(c[i].cloneNode(true)); + } + } + } + } + } + return ac; + } + + /* Cross-browser dynamic SWF creation + */ + function createSWF(attObj, parObj, id) { + var r, el = getElementById(id); + if (ua.wk && ua.wk < 312) { return r; } + if (el) { + if (typeof attObj.id == UNDEF) { // if no 'id' is defined for the object element, it will inherit the 'id' from the alternative content + attObj.id = id; + } + if (ua.ie && ua.win) { // Internet Explorer + the HTML object element + W3C DOM methods do not combine: fall back to outerHTML + var att = ""; + for (var i in attObj) { + if (attObj[i] != Object.prototype[i]) { // filter out prototype additions from other potential libraries + if (i.toLowerCase() == "data") { + parObj.movie = attObj[i]; + } + else if (i.toLowerCase() == "styleclass") { // 'class' is an ECMA4 reserved keyword + att += ' class="' + attObj[i] + '"'; + } + else if (i.toLowerCase() != "classid") { + att += ' ' + i + '="' + attObj[i] + '"'; + } + } + } + var par = ""; + for (var j in parObj) { + if (parObj[j] != Object.prototype[j]) { // filter out prototype additions from other potential libraries + par += ''; + } + } + el.outerHTML = '' + par + ''; + objIdArr[objIdArr.length] = attObj.id; // stored to fix object 'leaks' on unload (dynamic publishing only) + r = getElementById(attObj.id); + } + else { // well-behaving browsers + var o = createElement(OBJECT); + o.setAttribute("type", FLASH_MIME_TYPE); + for (var m in attObj) { + if (attObj[m] != Object.prototype[m]) { // filter out prototype additions from other potential libraries + if (m.toLowerCase() == "styleclass") { // 'class' is an ECMA4 reserved keyword + o.setAttribute("class", attObj[m]); + } + else if (m.toLowerCase() != "classid") { // filter out IE specific attribute + o.setAttribute(m, attObj[m]); + } + } + } + for (var n in parObj) { + if (parObj[n] != Object.prototype[n] && n.toLowerCase() != "movie") { // filter out prototype additions from other potential libraries and IE specific param element + createObjParam(o, n, parObj[n]); + } + } + el.parentNode.replaceChild(o, el); + r = o; + } + } + return r; + } + + function createObjParam(el, pName, pValue) { + var p = createElement("param"); + p.setAttribute("name", pName); + p.setAttribute("value", pValue); + el.appendChild(p); + } + + /* Cross-browser SWF removal + - Especially needed to safely and completely remove a SWF in Internet Explorer + */ + function removeSWF(id) { + var obj = getElementById(id); + if (obj && obj.nodeName == "OBJECT") { + if (ua.ie && ua.win) { + obj.style.display = "none"; + (function(){ + if (obj.readyState == 4) { + removeObjectInIE(id); + } + else { + setTimeout(arguments.callee, 10); + } + })(); + } + else { + obj.parentNode.removeChild(obj); + } + } + } + + function removeObjectInIE(id) { + var obj = getElementById(id); + if (obj) { + for (var i in obj) { + if (typeof obj[i] == "function") { + obj[i] = null; + } + } + obj.parentNode.removeChild(obj); + } + } + + /* Functions to optimize JavaScript compression + */ + function getElementById(id) { + var el = null; + try { + el = doc.getElementById(id); + } + catch (e) {} + return el; + } + + function createElement(el) { + return doc.createElement(el); + } + + /* Updated attachEvent function for Internet Explorer + - Stores attachEvent information in an Array, so on unload the detachEvent functions can be called to avoid memory leaks + */ + function addListener(target, eventType, fn) { + target.attachEvent(eventType, fn); + listenersArr[listenersArr.length] = [target, eventType, fn]; + } + + /* Flash Player and SWF content version matching + */ + function hasPlayerVersion(rv) { + var pv = ua.pv, v = rv.split("."); + v[0] = parseInt(v[0], 10); + v[1] = parseInt(v[1], 10) || 0; // supports short notation, e.g. "9" instead of "9.0.0" + v[2] = parseInt(v[2], 10) || 0; + return (pv[0] > v[0] || (pv[0] == v[0] && pv[1] > v[1]) || (pv[0] == v[0] && pv[1] == v[1] && pv[2] >= v[2])) ? true : false; + } + + /* Cross-browser dynamic CSS creation + - Based on Bobby van der Sluis' solution: http://www.bobbyvandersluis.com/articles/dynamicCSS.php + */ + function createCSS(sel, decl, media, newStyle) { + if (ua.ie && ua.mac) { return; } + var h = doc.getElementsByTagName("head")[0]; + if (!h) { return; } // to also support badly authored HTML pages that lack a head element + var m = (media && typeof media == "string") ? media : "screen"; + if (newStyle) { + dynamicStylesheet = null; + dynamicStylesheetMedia = null; + } + if (!dynamicStylesheet || dynamicStylesheetMedia != m) { + // create dynamic stylesheet + get a global reference to it + var s = createElement("style"); + s.setAttribute("type", "text/css"); + s.setAttribute("media", m); + dynamicStylesheet = h.appendChild(s); + if (ua.ie && ua.win && typeof doc.styleSheets != UNDEF && doc.styleSheets.length > 0) { + dynamicStylesheet = doc.styleSheets[doc.styleSheets.length - 1]; + } + dynamicStylesheetMedia = m; + } + // add style rule + if (ua.ie && ua.win) { + if (dynamicStylesheet && typeof dynamicStylesheet.addRule == OBJECT) { + dynamicStylesheet.addRule(sel, decl); + } + } + else { + if (dynamicStylesheet && typeof doc.createTextNode != UNDEF) { + dynamicStylesheet.appendChild(doc.createTextNode(sel + " {" + decl + "}")); + } + } + } + + function setVisibility(id, isVisible) { + if (!autoHideShow) { return; } + var v = isVisible ? "visible" : "hidden"; + if (isDomLoaded && getElementById(id)) { + getElementById(id).style.visibility = v; + } + else { + createCSS("#" + id, "visibility:" + v); + } + } + + /* Filter to avoid XSS attacks + */ + function urlEncodeIfNecessary(s) { + var regex = /[\\\"<>\.;]/; + var hasBadChars = regex.exec(s) != null; + return hasBadChars && typeof encodeURIComponent != UNDEF ? encodeURIComponent(s) : s; + } + + /* Release memory to avoid memory leaks caused by closures, fix hanging audio/video threads and force open sockets/NetConnections to disconnect (Internet Explorer only) + */ + var cleanup = function() { + if (ua.ie && ua.win) { + window.attachEvent("onunload", function() { + // remove listeners to avoid memory leaks + var ll = listenersArr.length; + for (var i = 0; i < ll; i++) { + listenersArr[i][0].detachEvent(listenersArr[i][1], listenersArr[i][2]); + } + // cleanup dynamically embedded objects to fix audio/video threads and force open sockets and NetConnections to disconnect + var il = objIdArr.length; + for (var j = 0; j < il; j++) { + removeSWF(objIdArr[j]); + } + // cleanup library's main closures to avoid memory leaks + for (var k in ua) { + ua[k] = null; + } + ua = null; + for (var l in swfobject) { + swfobject[l] = null; + } + swfobject = null; + }); + } + }(); + + return { + /* Public API + - Reference: http://code.google.com/p/swfobject/wiki/documentation + */ + registerObject: function(objectIdStr, swfVersionStr, xiSwfUrlStr, callbackFn) { + if (ua.w3 && objectIdStr && swfVersionStr) { + var regObj = {}; + regObj.id = objectIdStr; + regObj.swfVersion = swfVersionStr; + regObj.expressInstall = xiSwfUrlStr; + regObj.callbackFn = callbackFn; + regObjArr[regObjArr.length] = regObj; + setVisibility(objectIdStr, false); + } + else if (callbackFn) { + callbackFn({success:false, id:objectIdStr}); + } + }, + + getObjectById: function(objectIdStr) { + if (ua.w3) { + return getObjectById(objectIdStr); + } + }, + + embedSWF: function(swfUrlStr, replaceElemIdStr, widthStr, heightStr, swfVersionStr, xiSwfUrlStr, flashvarsObj, parObj, attObj, callbackFn) { + var callbackObj = {success:false, id:replaceElemIdStr}; + if (ua.w3 && !(ua.wk && ua.wk < 312) && swfUrlStr && replaceElemIdStr && widthStr && heightStr && swfVersionStr) { + setVisibility(replaceElemIdStr, false); + addDomLoadEvent(function() { + widthStr += ""; // auto-convert to string + heightStr += ""; + var att = {}; + if (attObj && typeof attObj === OBJECT) { + for (var i in attObj) { // copy object to avoid the use of references, because web authors often reuse attObj for multiple SWFs + att[i] = attObj[i]; + } + } + att.data = swfUrlStr; + att.width = widthStr; + att.height = heightStr; + var par = {}; + if (parObj && typeof parObj === OBJECT) { + for (var j in parObj) { // copy object to avoid the use of references, because web authors often reuse parObj for multiple SWFs + par[j] = parObj[j]; + } + } + if (flashvarsObj && typeof flashvarsObj === OBJECT) { + for (var k in flashvarsObj) { // copy object to avoid the use of references, because web authors often reuse flashvarsObj for multiple SWFs + if (typeof par.flashvars != UNDEF) { + par.flashvars += "&" + k + "=" + flashvarsObj[k]; + } + else { + par.flashvars = k + "=" + flashvarsObj[k]; + } + } + } + if (hasPlayerVersion(swfVersionStr)) { // create SWF + var obj = createSWF(att, par, replaceElemIdStr); + if (att.id == replaceElemIdStr) { + setVisibility(replaceElemIdStr, true); + } + callbackObj.success = true; + callbackObj.ref = obj; + } + else if (xiSwfUrlStr && canExpressInstall()) { // show Adobe Express Install + att.data = xiSwfUrlStr; + showExpressInstall(att, par, replaceElemIdStr, callbackFn); + return; + } + else { // show alternative content + setVisibility(replaceElemIdStr, true); + } + if (callbackFn) { callbackFn(callbackObj); } + }); + } + else if (callbackFn) { callbackFn(callbackObj); } + }, + + switchOffAutoHideShow: function() { + autoHideShow = false; + }, + + ua: ua, + + getFlashPlayerVersion: function() { + return { major:ua.pv[0], minor:ua.pv[1], release:ua.pv[2] }; + }, + + hasFlashPlayerVersion: hasPlayerVersion, + + createSWF: function(attObj, parObj, replaceElemIdStr) { + if (ua.w3) { + return createSWF(attObj, parObj, replaceElemIdStr); + } + else { + return undefined; + } + }, + + showExpressInstall: function(att, par, replaceElemIdStr, callbackFn) { + if (ua.w3 && canExpressInstall()) { + showExpressInstall(att, par, replaceElemIdStr, callbackFn); + } + }, + + removeSWF: function(objElemIdStr) { + if (ua.w3) { + removeSWF(objElemIdStr); + } + }, + + createCSS: function(selStr, declStr, mediaStr, newStyleBoolean) { + if (ua.w3) { + createCSS(selStr, declStr, mediaStr, newStyleBoolean); + } + }, + + addDomLoadEvent: addDomLoadEvent, + + addLoadEvent: addLoadEvent, + + getQueryParamValue: function(param) { + var q = doc.location.search || doc.location.hash; + if (q) { + if (/\?/.test(q)) { q = q.split("?")[1]; } // strip question mark + if (param == null) { + return urlEncodeIfNecessary(q); + } + var pairs = q.split("&"); + for (var i = 0; i < pairs.length; i++) { + if (pairs[i].substring(0, pairs[i].indexOf("=")) == param) { + return urlEncodeIfNecessary(pairs[i].substring((pairs[i].indexOf("=") + 1))); + } + } + } + return ""; + }, + + // For internal usage only + expressInstallCallback: function() { + if (isExpressInstallActive) { + var obj = getElementById(EXPRESS_INSTALL_ID); + if (obj && storedAltContent) { + obj.parentNode.replaceChild(storedAltContent, obj); + if (storedAltContentId) { + setVisibility(storedAltContentId, true); + if (ua.ie && ua.win) { storedAltContent.style.display = "block"; } + } + if (storedCallbackFn) { storedCallbackFn(storedCallbackObj); } + } + isExpressInstallActive = false; + } + } + }; +}(); diff --git a/working-examples/flash-scale-movie-dimensions-on-text-resize/swfobject/swfobject.js b/working-examples/flash-scale-movie-dimensions-on-text-resize/swfobject/swfobject.js new file mode 100644 index 0000000000..8eafe9dd83 --- /dev/null +++ b/working-examples/flash-scale-movie-dimensions-on-text-resize/swfobject/swfobject.js @@ -0,0 +1,4 @@ +/* SWFObject v2.2 + is released under the MIT License +*/ +var swfobject=function(){var D="undefined",r="object",S="Shockwave Flash",W="ShockwaveFlash.ShockwaveFlash",q="application/x-shockwave-flash",R="SWFObjectExprInst",x="onreadystatechange",O=window,j=document,t=navigator,T=false,U=[h],o=[],N=[],I=[],l,Q,E,B,J=false,a=false,n,G,m=true,M=function(){var aa=typeof j.getElementById!=D&&typeof j.getElementsByTagName!=D&&typeof j.createElement!=D,ah=t.userAgent.toLowerCase(),Y=t.platform.toLowerCase(),ae=Y?/win/.test(Y):/win/.test(ah),ac=Y?/mac/.test(Y):/mac/.test(ah),af=/webkit/.test(ah)?parseFloat(ah.replace(/^.*webkit\/(\d+(\.\d+)?).*$/,"$1")):false,X=!+"\v1",ag=[0,0,0],ab=null;if(typeof t.plugins!=D&&typeof t.plugins[S]==r){ab=t.plugins[S].description;if(ab&&!(typeof t.mimeTypes!=D&&t.mimeTypes[q]&&!t.mimeTypes[q].enabledPlugin)){T=true;X=false;ab=ab.replace(/^.*\s+(\S+\s+\S+$)/,"$1");ag[0]=parseInt(ab.replace(/^(.*)\..*$/,"$1"),10);ag[1]=parseInt(ab.replace(/^.*\.(.*)\s.*$/,"$1"),10);ag[2]=/[a-zA-Z]/.test(ab)?parseInt(ab.replace(/^.*[a-zA-Z]+(.*)$/,"$1"),10):0}}else{if(typeof O.ActiveXObject!=D){try{var ad=new ActiveXObject(W);if(ad){ab=ad.GetVariable("$version");if(ab){X=true;ab=ab.split(" ")[1].split(",");ag=[parseInt(ab[0],10),parseInt(ab[1],10),parseInt(ab[2],10)]}}}catch(Z){}}}return{w3:aa,pv:ag,wk:af,ie:X,win:ae,mac:ac}}(),k=function(){if(!M.w3){return}if((typeof j.readyState!=D&&j.readyState=="complete")||(typeof j.readyState==D&&(j.getElementsByTagName("body")[0]||j.body))){f()}if(!J){if(typeof j.addEventListener!=D){j.addEventListener("DOMContentLoaded",f,false)}if(M.ie&&M.win){j.attachEvent(x,function(){if(j.readyState=="complete"){j.detachEvent(x,arguments.callee);f()}});if(O==top){(function(){if(J){return}try{j.documentElement.doScroll("left")}catch(X){setTimeout(arguments.callee,0);return}f()})()}}if(M.wk){(function(){if(J){return}if(!/loaded|complete/.test(j.readyState)){setTimeout(arguments.callee,0);return}f()})()}s(f)}}();function f(){if(J){return}try{var Z=j.getElementsByTagName("body")[0].appendChild(C("span"));Z.parentNode.removeChild(Z)}catch(aa){return}J=true;var X=U.length;for(var Y=0;Y0){for(var af=0;af0){var ae=c(Y);if(ae){if(F(o[af].swfVersion)&&!(M.wk&&M.wk<312)){w(Y,true);if(ab){aa.success=true;aa.ref=z(Y);ab(aa)}}else{if(o[af].expressInstall&&A()){var ai={};ai.data=o[af].expressInstall;ai.width=ae.getAttribute("width")||"0";ai.height=ae.getAttribute("height")||"0";if(ae.getAttribute("class")){ai.styleclass=ae.getAttribute("class")}if(ae.getAttribute("align")){ai.align=ae.getAttribute("align")}var ah={};var X=ae.getElementsByTagName("param");var ac=X.length;for(var ad=0;ad'}}aa.outerHTML='"+af+"";N[N.length]=ai.id;X=c(ai.id)}else{var Z=C(r);Z.setAttribute("type",q);for(var ac in ai){if(ai[ac]!=Object.prototype[ac]){if(ac.toLowerCase()=="styleclass"){Z.setAttribute("class",ai[ac])}else{if(ac.toLowerCase()!="classid"){Z.setAttribute(ac,ai[ac])}}}}for(var ab in ag){if(ag[ab]!=Object.prototype[ab]&&ab.toLowerCase()!="movie"){e(Z,ab,ag[ab])}}aa.parentNode.replaceChild(Z,aa);X=Z}}return X}function e(Z,X,Y){var aa=C("param");aa.setAttribute("name",X);aa.setAttribute("value",Y);Z.appendChild(aa)}function y(Y){var X=c(Y);if(X&&X.nodeName=="OBJECT"){if(M.ie&&M.win){X.style.display="none";(function(){if(X.readyState==4){b(Y)}else{setTimeout(arguments.callee,10)}})()}else{X.parentNode.removeChild(X)}}}function b(Z){var Y=c(Z);if(Y){for(var X in Y){if(typeof Y[X]=="function"){Y[X]=null}}Y.parentNode.removeChild(Y)}}function c(Z){var X=null;try{X=j.getElementById(Z)}catch(Y){}return X}function C(X){return j.createElement(X)}function i(Z,X,Y){Z.attachEvent(X,Y);I[I.length]=[Z,X,Y]}function F(Z){var Y=M.pv,X=Z.split(".");X[0]=parseInt(X[0],10);X[1]=parseInt(X[1],10)||0;X[2]=parseInt(X[2],10)||0;return(Y[0]>X[0]||(Y[0]==X[0]&&Y[1]>X[1])||(Y[0]==X[0]&&Y[1]==X[1]&&Y[2]>=X[2]))?true:false}function v(ac,Y,ad,ab){if(M.ie&&M.mac){return}var aa=j.getElementsByTagName("head")[0];if(!aa){return}var X=(ad&&typeof ad=="string")?ad:"screen";if(ab){n=null;G=null}if(!n||G!=X){var Z=C("style");Z.setAttribute("type","text/css");Z.setAttribute("media",X);n=aa.appendChild(Z);if(M.ie&&M.win&&typeof j.styleSheets!=D&&j.styleSheets.length>0){n=j.styleSheets[j.styleSheets.length-1]}G=X}if(M.ie&&M.win){if(n&&typeof n.addRule==r){n.addRule(ac,Y)}}else{if(n&&typeof j.createTextNode!=D){n.appendChild(j.createTextNode(ac+" {"+Y+"}"))}}}function w(Z,X){if(!m){return}var Y=X?"visible":"hidden";if(J&&c(Z)){c(Z).style.visibility=Y}else{v("#"+Z,"visibility:"+Y)}}function L(Y){var Z=/[\\\"<>\.;]/;var X=Z.exec(Y)!=null;return X&&typeof encodeURIComponent!=D?encodeURIComponent(Y):Y}var d=function(){if(M.ie&&M.win){window.attachEvent("onunload",function(){var ac=I.length;for(var ab=0;ab + + + +screen_reader_detection_to_prevent_autoplay_as3 + + + + + + + + + + diff --git a/working-examples/flash-screen-reader-detection-to-prevent-autoplay/screen_reader_detection_to_prevent_autoplay_as3.fla b/working-examples/flash-screen-reader-detection-to-prevent-autoplay/screen_reader_detection_to_prevent_autoplay_as3.fla new file mode 100644 index 0000000000..8a07dc1c07 Binary files /dev/null and b/working-examples/flash-screen-reader-detection-to-prevent-autoplay/screen_reader_detection_to_prevent_autoplay_as3.fla differ diff --git a/working-examples/flash-screen-reader-detection-to-prevent-autoplay/screen_reader_detection_to_prevent_autoplay_as3.swf b/working-examples/flash-screen-reader-detection-to-prevent-autoplay/screen_reader_detection_to_prevent_autoplay_as3.swf new file mode 100644 index 0000000000..af53c80877 Binary files /dev/null and b/working-examples/flash-screen-reader-detection-to-prevent-autoplay/screen_reader_detection_to_prevent_autoplay_as3.swf differ diff --git a/working-examples/flash-setting-label-property/index.html b/working-examples/flash-setting-label-property/index.html new file mode 100644 index 0000000000..2100fa4604 --- /dev/null +++ b/working-examples/flash-setting-label-property/index.html @@ -0,0 +1,319 @@ + + + + +setting_label_property_as3 + + + + + + + + + + diff --git a/working-examples/flash-setting-label-property/setting_label_property_as3.fla b/working-examples/flash-setting-label-property/setting_label_property_as3.fla new file mode 100644 index 0000000000..77d4600678 Binary files /dev/null and b/working-examples/flash-setting-label-property/setting_label_property_as3.fla differ diff --git a/working-examples/flash-setting-label-property/setting_label_property_as3.swf b/working-examples/flash-setting-label-property/setting_label_property_as3.swf new file mode 100644 index 0000000000..74db82be1b Binary files /dev/null and b/working-examples/flash-setting-label-property/setting_label_property_as3.swf differ diff --git a/working-examples/flash-text-description-for-image-buttons/index.html b/working-examples/flash-text-description-for-image-buttons/index.html new file mode 100644 index 0000000000..75c17bac10 --- /dev/null +++ b/working-examples/flash-text-description-for-image-buttons/index.html @@ -0,0 +1,319 @@ + + + + +text_description_for_image_buttons_as3 + + + + + + + + + + diff --git a/working-examples/flash-text-description-for-image-buttons/text_description_for_image_buttons_as3.fla b/working-examples/flash-text-description-for-image-buttons/text_description_for_image_buttons_as3.fla new file mode 100644 index 0000000000..789aca9170 Binary files /dev/null and b/working-examples/flash-text-description-for-image-buttons/text_description_for_image_buttons_as3.fla differ diff --git a/working-examples/flash-text-description-for-image-buttons/text_description_for_image_buttons_as3.swf b/working-examples/flash-text-description-for-image-buttons/text_description_for_image_buttons_as3.swf new file mode 100644 index 0000000000..103569a7c0 Binary files /dev/null and b/working-examples/flash-text-description-for-image-buttons/text_description_for_image_buttons_as3.swf differ diff --git a/working-examples/flash-text-description-for-simpleimage-buttons/index.html b/working-examples/flash-text-description-for-simpleimage-buttons/index.html new file mode 100644 index 0000000000..717b00c760 --- /dev/null +++ b/working-examples/flash-text-description-for-simpleimage-buttons/index.html @@ -0,0 +1,319 @@ + + + + +Text_description_for_simpleimage_buttons_as3 + + + + + + + + + + diff --git a/working-examples/flash-text-description-for-simpleimage-buttons/text_description_for_simpleimage_buttons_as3.fla b/working-examples/flash-text-description-for-simpleimage-buttons/text_description_for_simpleimage_buttons_as3.fla new file mode 100644 index 0000000000..00c4bfdf07 Binary files /dev/null and b/working-examples/flash-text-description-for-simpleimage-buttons/text_description_for_simpleimage_buttons_as3.fla differ diff --git a/working-examples/flash-text-description-for-simpleimage-buttons/text_description_for_simpleimage_buttons_as3.swf b/working-examples/flash-text-description-for-simpleimage-buttons/text_description_for_simpleimage_buttons_as3.swf new file mode 100644 index 0000000000..e63b177d6f Binary files /dev/null and b/working-examples/flash-text-description-for-simpleimage-buttons/text_description_for_simpleimage_buttons_as3.swf differ diff --git a/working-examples/flash-timeout-extension/index.html b/working-examples/flash-timeout-extension/index.html new file mode 100644 index 0000000000..391fb81bd1 --- /dev/null +++ b/working-examples/flash-timeout-extension/index.html @@ -0,0 +1,322 @@ + + + + +timeout_extension_as2 + + + + + + + + + + + diff --git a/working-examples/flash-timeout-extension/timeout_extension_as2.fla b/working-examples/flash-timeout-extension/timeout_extension_as2.fla new file mode 100644 index 0000000000..d5abd6d96b Binary files /dev/null and b/working-examples/flash-timeout-extension/timeout_extension_as2.fla differ diff --git a/working-examples/flash-timeout-extension/timeout_extension_as2.swf b/working-examples/flash-timeout-extension/timeout_extension_as2.swf new file mode 100644 index 0000000000..93bbbc2a2a Binary files /dev/null and b/working-examples/flash-timeout-extension/timeout_extension_as2.swf differ diff --git a/working-examples/flash-using-auto-labeling-to-associate-label-text-with-controls/index.html b/working-examples/flash-using-auto-labeling-to-associate-label-text-with-controls/index.html new file mode 100644 index 0000000000..6afb7648be --- /dev/null +++ b/working-examples/flash-using-auto-labeling-to-associate-label-text-with-controls/index.html @@ -0,0 +1,319 @@ + + + + +using_auto_labeling_to_associate_label_text_with_controls_as3 + + + + + + + + + + diff --git a/working-examples/flash-using-auto-labeling-to-associate-label-text-with-controls/using_auto_labeling_to_associate_label_text_with_controls_as3.fla b/working-examples/flash-using-auto-labeling-to-associate-label-text-with-controls/using_auto_labeling_to_associate_label_text_with_controls_as3.fla new file mode 100644 index 0000000000..682e6bfe61 Binary files /dev/null and b/working-examples/flash-using-auto-labeling-to-associate-label-text-with-controls/using_auto_labeling_to_associate_label_text_with_controls_as3.fla differ diff --git a/working-examples/flash-using-auto-labeling-to-associate-label-text-with-controls/using_auto_labeling_to_associate_label_text_with_controls_as3.swf b/working-examples/flash-using-auto-labeling-to-associate-label-text-with-controls/using_auto_labeling_to_associate_label_text_with_controls_as3.swf new file mode 100644 index 0000000000..434dd4b76e Binary files /dev/null and b/working-examples/flash-using-auto-labeling-to-associate-label-text-with-controls/using_auto_labeling_to_associate_label_text_with_controls_as3.swf differ diff --git a/working-examples/flash-using-datagrid-to-associate-headers-with-cells/index.html b/working-examples/flash-using-datagrid-to-associate-headers-with-cells/index.html new file mode 100644 index 0000000000..2d6f9abdea --- /dev/null +++ b/working-examples/flash-using-datagrid-to-associate-headers-with-cells/index.html @@ -0,0 +1,49 @@ + + + + using_datagrid_to_associate_headers_with_cells_as3 + + + + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + Get Adobe Flash player + + + + + +
    + + diff --git a/working-examples/flash-using-datagrid-to-associate-headers-with-cells/using_datagrid_to_associate_headers_with_cells_as3.fla b/working-examples/flash-using-datagrid-to-associate-headers-with-cells/using_datagrid_to_associate_headers_with_cells_as3.fla new file mode 100644 index 0000000000..7ed5b6161f Binary files /dev/null and b/working-examples/flash-using-datagrid-to-associate-headers-with-cells/using_datagrid_to_associate_headers_with_cells_as3.fla differ diff --git a/working-examples/flash-using-datagrid-to-associate-headers-with-cells/using_datagrid_to_associate_headers_with_cells_as3.swf b/working-examples/flash-using-datagrid-to-associate-headers-with-cells/using_datagrid_to_associate_headers_with_cells_as3.swf new file mode 100644 index 0000000000..7b23ef89de Binary files /dev/null and b/working-examples/flash-using-datagrid-to-associate-headers-with-cells/using_datagrid_to_associate_headers_with_cells_as3.swf differ diff --git a/working-examples/focus-pseudo-class/index.html b/working-examples/focus-pseudo-class/index.html new file mode 100644 index 0000000000..0c9228d503 --- /dev/null +++ b/working-examples/focus-pseudo-class/index.html @@ -0,0 +1,27 @@ + + + + + + Highlighting elements that receive focus + +
    +

    + +

    +

    +
    + +

    +
    + + diff --git a/working-examples/input-resize/index.html b/working-examples/input-resize/index.html new file mode 100644 index 0000000000..3607b7ef55 --- /dev/null +++ b/working-examples/input-resize/index.html @@ -0,0 +1,24 @@ + + + + +Example of resizing input with CSS + + + + + +

    Contact Us

    +

    Please provide us with your details and we will contact you as soon as we can. Note that all of the form fields are required.

    +
    +

    +

    +

    +

    + +
    + + diff --git a/working-examples/link-contrast/index.html b/working-examples/link-contrast/index.html new file mode 100644 index 0000000000..ff34f9ff55 --- /dev/null +++ b/working-examples/link-contrast/index.html @@ -0,0 +1,276 @@ + + + + + + + + +Links with a 3:1 contrast ratio with surrounding text + + + + + +

    Links with a 3:1 contrast ratio with surrounding text

    + + +

    Link color #3333FF (3.1:1 vs. black)

    +

    The following paragraph shows essentially what this blue color would look like to most people, including most people with limited color vision. When color is used, a blue color is recommended because it is affected very little by red and green color blindness (Protanopia and Deuteranopia).

    + +

    In the early evening of 16 December 1997, episode 38 of the hugely popular children’s animation series Pocket Monsters was broadcast over much of Japan on a commercial TV network. The program had around 10 million viewers, and was viewed by no less than 80% of the 7-10 age group in the Tokyo area according to a government survey. During and after the broadcast, some viewers experienced distressing symptoms ranging from nausea and dizziness to epileptic seizures. A wave of emergency calls and hospital admissions suggested a single environmental cause which was soon identified as the animation, and in particular one sequence in which red and cyan colors flashed in an alternation at around 12Hz covering much of the screen area. Before the cause had been pinpointed this sequence was shown on a news bulletin about the incident, resulting in further casualties. Altogether 685 people, most of them children, were hospitalized although most were discharged quickly.

    + +

    Link color #5E5E00 (3.1:1 vs. black)

    +

    The following paragraph gives an idea of what red or green links with a 3:1 contrast ratio might look like to people with protanopia and deuteranopia.

    + +

    In the early evening of 16 December 1997, episode 38 of the hugely popular children’s animation series Pocket Monsters was broadcast over much of Japan on a commercial TV network. The program had around 10 million viewers, and was viewed by no less than 80% of the 7-10 age group in the Tokyo area according to a government survey. During and after the broadcast, some viewers experienced distressing symptoms ranging from nausea and dizziness to epileptic seizures. A wave of emergency calls and hospital admissions suggested a single environmental cause which was soon identified as the animation, and in particular one sequence in which red and cyan colors flashed in an alternation at around 12Hz covering much of the screen area. Before the cause had been pinpointed this sequence was shown on a news bulletin about the incident, resulting in further casualties. Altogether 685 people, most of them children, were hospitalized although most were discharged quickly.

    + +

    Link color #5A5A5A (3:1 vs. black)

    +

    A very small portion of the population has total color blindness. For these users, a 3:1 contrast ratio would be less usable (no color difference) but can still be seen. For example, try to count the links in the paragraph below. You can see that it is possible to differentiate them from the rest of the text.

    + +

    In the early evening of 16 December 1997, episode 38 of the hugely popular children's animation series Pocket Monsters was broadcast over much of Japan on a commercial TV network. The program had around 10 million viewers, and was viewed by no less than 80% of the 7-10 age group in the Tokyo area according to a government survey. During and after the broadcast, some viewers experienced distressing symptoms ranging from nausea and dizziness to epileptic seizures. A wave of emergency calls and hospital admissions suggested a single environmental cause which was soon identified as the animation, and in particular one sequence in which red and cyan colors flashed in an alternation at around 12Hz covering much of the screen area. Before the cause had been pinpointed this sequence was shown on a news bulletin about the incident, resulting in further casualties. Altogether 685 people, most of them children, were hospitalized although most were discharged quickly.

    + + +

    Note: The use of color plus luminosity is used in this technique while luminsity alone is used for contrast. This is because this technique is about telling the difference (a noticable difference) between pieces of text whereas the contrast measure is about the readability of the text with its background for different color and vision disabilities.

    +

    The following 26 web-safe colors pass at 3:1 vs black and 5:1 vs. white

    + + ++++ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    Color ValueColor SwatchColored Text Sample
    #CC0000 The quick brown fox
    #CC0033 The quick brown fox
    #CC0066 The quick brown fox
    #CC0099 The quick brown fox
    #9900CC The quick brown fox
    #6600FF The quick brown fox
    #9900FF The quick brown fox
    #CC3300 The quick brown fox
    #CC3333 The quick brown fox
    #993366 The quick brown fox
    #993399 The quick brown fox
    #9933CC The quick brown fox
    #3333FF The quick brown fox
    #6633FF The quick brown fox
    #336600 The quick brown fox
    #666600 The quick brown fox
    #336633 The quick brown fox
    #666633 The quick brown fox
    #006666 The quick brown fox
    #336666 The quick brown fox
    #666666 The quick brown fox
    #006699 The quick brown fox
    #336699 The quick brown fox
    #666699 The quick brown fox
    #0066CC The quick brown fox
    #3366CC The quick brown fox
    + + + + + + diff --git a/working-examples/link-wraps-block/alerticon.png b/working-examples/link-wraps-block/alerticon.png new file mode 100644 index 0000000000..d2e286f4ed Binary files /dev/null and b/working-examples/link-wraps-block/alerticon.png differ diff --git a/working-examples/link-wraps-block/index.html b/working-examples/link-wraps-block/index.html new file mode 100644 index 0000000000..2de8f1c8e5 --- /dev/null +++ b/working-examples/link-wraps-block/index.html @@ -0,0 +1,33 @@ + + + + + + +H30 Example 7 + + + + + + +

    Example 7

    +

    Working example of using a link to wrap block level elements in HTML5.

    + + + + + + diff --git a/working-examples/pdf-abbreviation-definitions/headers-definitions.docx b/working-examples/pdf-abbreviation-definitions/headers-definitions.docx new file mode 100644 index 0000000000..4cf6dab94f Binary files /dev/null and b/working-examples/pdf-abbreviation-definitions/headers-definitions.docx differ diff --git a/working-examples/pdf-abbreviation-definitions/headers-definitions.odt b/working-examples/pdf-abbreviation-definitions/headers-definitions.odt new file mode 100644 index 0000000000..161f5521e0 Binary files /dev/null and b/working-examples/pdf-abbreviation-definitions/headers-definitions.odt differ diff --git a/working-examples/pdf-abbreviation-definitions/headers-definitions.pdf b/working-examples/pdf-abbreviation-definitions/headers-definitions.pdf new file mode 100644 index 0000000000..92d6c1cd44 Binary files /dev/null and b/working-examples/pdf-abbreviation-definitions/headers-definitions.pdf differ diff --git a/working-examples/pdf-alt-entry-to-an-image/alt-entry-to-an-image.docx b/working-examples/pdf-alt-entry-to-an-image/alt-entry-to-an-image.docx new file mode 100644 index 0000000000..5ebc035ebb Binary files /dev/null and b/working-examples/pdf-alt-entry-to-an-image/alt-entry-to-an-image.docx differ diff --git a/working-examples/pdf-alt-entry-to-an-image/alt-entry-to-an-image.pdf b/working-examples/pdf-alt-entry-to-an-image/alt-entry-to-an-image.pdf new file mode 100644 index 0000000000..ded5c6705d Binary files /dev/null and b/working-examples/pdf-alt-entry-to-an-image/alt-entry-to-an-image.pdf differ diff --git a/working-examples/pdf-bookmarks/bookmarks.docx b/working-examples/pdf-bookmarks/bookmarks.docx new file mode 100644 index 0000000000..1fb8157dd7 Binary files /dev/null and b/working-examples/pdf-bookmarks/bookmarks.docx differ diff --git a/working-examples/pdf-bookmarks/bookmarks.odt b/working-examples/pdf-bookmarks/bookmarks.odt new file mode 100644 index 0000000000..5c00f7a3ed Binary files /dev/null and b/working-examples/pdf-bookmarks/bookmarks.odt differ diff --git a/working-examples/pdf-bookmarks/bookmarks.pdf b/working-examples/pdf-bookmarks/bookmarks.pdf new file mode 100644 index 0000000000..517244afe4 Binary files /dev/null and b/working-examples/pdf-bookmarks/bookmarks.pdf differ diff --git a/working-examples/pdf-decorative-image/decorative-image.docx b/working-examples/pdf-decorative-image/decorative-image.docx new file mode 100644 index 0000000000..a6c9ad1770 Binary files /dev/null and b/working-examples/pdf-decorative-image/decorative-image.docx differ diff --git a/working-examples/pdf-decorative-image/decorative-image.pdf b/working-examples/pdf-decorative-image/decorative-image.pdf new file mode 100644 index 0000000000..d1cf55f50d Binary files /dev/null and b/working-examples/pdf-decorative-image/decorative-image.pdf differ diff --git a/working-examples/pdf-document-title/title-bar.pdf b/working-examples/pdf-document-title/title-bar.pdf new file mode 100644 index 0000000000..7148f76a02 Binary files /dev/null and b/working-examples/pdf-document-title/title-bar.pdf differ diff --git a/working-examples/pdf-form-labels/form-lc.pdf b/working-examples/pdf-form-labels/form-lc.pdf new file mode 100644 index 0000000000..69b81e482f Binary files /dev/null and b/working-examples/pdf-form-labels/form-lc.pdf differ diff --git a/working-examples/pdf-form-labels/form.pdf b/working-examples/pdf-form-labels/form.pdf new file mode 100644 index 0000000000..d04c90ef1a Binary files /dev/null and b/working-examples/pdf-form-labels/form.pdf differ diff --git a/working-examples/pdf-headers-footers/headers-footers-oo.pdf b/working-examples/pdf-headers-footers/headers-footers-oo.pdf new file mode 100644 index 0000000000..cfd08260b4 Binary files /dev/null and b/working-examples/pdf-headers-footers/headers-footers-oo.pdf differ diff --git a/working-examples/pdf-headers-footers/headers-footers-word.pdf b/working-examples/pdf-headers-footers/headers-footers-word.pdf new file mode 100644 index 0000000000..b3dbfc48bd Binary files /dev/null and b/working-examples/pdf-headers-footers/headers-footers-word.pdf differ diff --git a/working-examples/pdf-headers-footers/headers-footers.docx b/working-examples/pdf-headers-footers/headers-footers.docx new file mode 100644 index 0000000000..8e51a20f9f Binary files /dev/null and b/working-examples/pdf-headers-footers/headers-footers.docx differ diff --git a/working-examples/pdf-headers-footers/headers-footers.odt b/working-examples/pdf-headers-footers/headers-footers.odt new file mode 100644 index 0000000000..89bf4fe9d0 Binary files /dev/null and b/working-examples/pdf-headers-footers/headers-footers.odt differ diff --git a/working-examples/pdf-headings/cooking.docx b/working-examples/pdf-headings/cooking.docx new file mode 100644 index 0000000000..773ce8553b Binary files /dev/null and b/working-examples/pdf-headings/cooking.docx differ diff --git a/working-examples/pdf-headings/cooking.pdf b/working-examples/pdf-headings/cooking.pdf new file mode 100644 index 0000000000..75680e6c48 Binary files /dev/null and b/working-examples/pdf-headings/cooking.pdf differ diff --git a/working-examples/pdf-interactive-form-fields/form-fields-keybd-lc.pdf b/working-examples/pdf-interactive-form-fields/form-fields-keybd-lc.pdf new file mode 100644 index 0000000000..1702b2afb0 Binary files /dev/null and b/working-examples/pdf-interactive-form-fields/form-fields-keybd-lc.pdf differ diff --git a/working-examples/pdf-interactive-form-fields/form-fields-keybd.pdf b/working-examples/pdf-interactive-form-fields/form-fields-keybd.pdf new file mode 100644 index 0000000000..d04c90ef1a Binary files /dev/null and b/working-examples/pdf-interactive-form-fields/form-fields-keybd.pdf differ diff --git a/working-examples/pdf-lang-phrase/lang-of-phrase.pdf b/working-examples/pdf-lang-phrase/lang-of-phrase.pdf new file mode 100644 index 0000000000..28fb5a32c4 Binary files /dev/null and b/working-examples/pdf-lang-phrase/lang-of-phrase.pdf differ diff --git a/working-examples/pdf-lang/language-en.pdf b/working-examples/pdf-lang/language-en.pdf new file mode 100644 index 0000000000..9906072c3a Binary files /dev/null and b/working-examples/pdf-lang/language-en.pdf differ diff --git a/working-examples/pdf-link-alt-text/link-text-oo.pdf b/working-examples/pdf-link-alt-text/link-text-oo.pdf new file mode 100644 index 0000000000..6d71b9bd4a Binary files /dev/null and b/working-examples/pdf-link-alt-text/link-text-oo.pdf differ diff --git a/working-examples/pdf-link-alt-text/link-text.odt b/working-examples/pdf-link-alt-text/link-text.odt new file mode 100644 index 0000000000..a68b37aef3 Binary files /dev/null and b/working-examples/pdf-link-alt-text/link-text.odt differ diff --git a/working-examples/pdf-links/links.pdf b/working-examples/pdf-links/links.pdf new file mode 100644 index 0000000000..28fb5a32c4 Binary files /dev/null and b/working-examples/pdf-links/links.pdf differ diff --git a/working-examples/pdf-lists/lists.odt b/working-examples/pdf-lists/lists.odt new file mode 100644 index 0000000000..befc69f768 Binary files /dev/null and b/working-examples/pdf-lists/lists.odt differ diff --git a/working-examples/pdf-lists/lists.pdf b/working-examples/pdf-lists/lists.pdf new file mode 100644 index 0000000000..e7910aaa93 Binary files /dev/null and b/working-examples/pdf-lists/lists.pdf differ diff --git a/working-examples/pdf-ocr/ocr-example-tagged.pdf b/working-examples/pdf-ocr/ocr-example-tagged.pdf new file mode 100644 index 0000000000..fb10c2ac20 Binary files /dev/null and b/working-examples/pdf-ocr/ocr-example-tagged.pdf differ diff --git a/working-examples/pdf-ocr/ocr-example.pdf b/working-examples/pdf-ocr/ocr-example.pdf new file mode 100644 index 0000000000..a02ba095a6 Binary files /dev/null and b/working-examples/pdf-ocr/ocr-example.pdf differ diff --git a/working-examples/pdf-page-numbers/page-numbers.docx b/working-examples/pdf-page-numbers/page-numbers.docx new file mode 100644 index 0000000000..e4c1c64894 Binary files /dev/null and b/working-examples/pdf-page-numbers/page-numbers.docx differ diff --git a/working-examples/pdf-page-numbers/page-numbers.pdf b/working-examples/pdf-page-numbers/page-numbers.pdf new file mode 100644 index 0000000000..e17e69b6bc Binary files /dev/null and b/working-examples/pdf-page-numbers/page-numbers.pdf differ diff --git a/working-examples/pdf-reading-order/reading-order-2cols-oo.odt b/working-examples/pdf-reading-order/reading-order-2cols-oo.odt new file mode 100644 index 0000000000..3eefff64cd Binary files /dev/null and b/working-examples/pdf-reading-order/reading-order-2cols-oo.odt differ diff --git a/working-examples/pdf-reading-order/reading-order-2cols-oo.pdf b/working-examples/pdf-reading-order/reading-order-2cols-oo.pdf new file mode 100644 index 0000000000..3fe735eeaf Binary files /dev/null and b/working-examples/pdf-reading-order/reading-order-2cols-oo.pdf differ diff --git a/working-examples/pdf-reading-order/reading-order-2cols-word.docx b/working-examples/pdf-reading-order/reading-order-2cols-word.docx new file mode 100644 index 0000000000..6bb8e41a4d Binary files /dev/null and b/working-examples/pdf-reading-order/reading-order-2cols-word.docx differ diff --git a/working-examples/pdf-reading-order/reading-order-2cols-word.pdf b/working-examples/pdf-reading-order/reading-order-2cols-word.pdf new file mode 100644 index 0000000000..1a47ac16bb Binary files /dev/null and b/working-examples/pdf-reading-order/reading-order-2cols-word.pdf differ diff --git a/working-examples/pdf-reading-order/reading-order.docx b/working-examples/pdf-reading-order/reading-order.docx new file mode 100644 index 0000000000..529bfd9352 Binary files /dev/null and b/working-examples/pdf-reading-order/reading-order.docx differ diff --git a/working-examples/pdf-reading-order/reading-order.pdf b/working-examples/pdf-reading-order/reading-order.pdf new file mode 100644 index 0000000000..e7961f7429 Binary files /dev/null and b/working-examples/pdf-reading-order/reading-order.pdf differ diff --git a/working-examples/pdf-required-fields/required-fields-lc.pdf b/working-examples/pdf-required-fields/required-fields-lc.pdf new file mode 100644 index 0000000000..b146b07d57 Binary files /dev/null and b/working-examples/pdf-required-fields/required-fields-lc.pdf differ diff --git a/working-examples/pdf-required-fields/required-fields.pdf b/working-examples/pdf-required-fields/required-fields.pdf new file mode 100644 index 0000000000..48b01f606c Binary files /dev/null and b/working-examples/pdf-required-fields/required-fields.pdf differ diff --git a/working-examples/pdf-submit-button/submit-button-js.pdf b/working-examples/pdf-submit-button/submit-button-js.pdf new file mode 100644 index 0000000000..5b2107920c Binary files /dev/null and b/working-examples/pdf-submit-button/submit-button-js.pdf differ diff --git a/working-examples/pdf-table/table.docx b/working-examples/pdf-table/table.docx new file mode 100644 index 0000000000..a01019d081 Binary files /dev/null and b/working-examples/pdf-table/table.docx differ diff --git a/working-examples/pdf-table/table.pdf b/working-examples/pdf-table/table.pdf new file mode 100644 index 0000000000..b8e1353851 Binary files /dev/null and b/working-examples/pdf-table/table.pdf differ diff --git a/working-examples/pdf-tables/table-example-noheaderrow.docx b/working-examples/pdf-tables/table-example-noheaderrow.docx new file mode 100644 index 0000000000..7114e16e0f Binary files /dev/null and b/working-examples/pdf-tables/table-example-noheaderrow.docx differ diff --git a/working-examples/pdf-tables/table-example-noheaderrow.odt b/working-examples/pdf-tables/table-example-noheaderrow.odt new file mode 100644 index 0000000000..a4897e409b Binary files /dev/null and b/working-examples/pdf-tables/table-example-noheaderrow.odt differ diff --git a/working-examples/pdf-tables/table-example-repaired.pdf b/working-examples/pdf-tables/table-example-repaired.pdf new file mode 100644 index 0000000000..f2185f9a67 Binary files /dev/null and b/working-examples/pdf-tables/table-example-repaired.pdf differ diff --git a/working-examples/radio-checkbox-resize/index.html b/working-examples/radio-checkbox-resize/index.html new file mode 100644 index 0000000000..d290c6f69b --- /dev/null +++ b/working-examples/radio-checkbox-resize/index.html @@ -0,0 +1,20 @@ + + + + +Example of resizing radio buttons and checkboxes with CSS + + + + + +
    +

    +

    +
    + + diff --git a/working-examples/script-action-buttons/index.html b/working-examples/script-action-buttons/index.html new file mode 100644 index 0000000000..d27091cfcc --- /dev/null +++ b/working-examples/script-action-buttons/index.html @@ -0,0 +1,34 @@ + + + + + + Creating Action Buttons using JavaScript + + + +

    Here is the button to modify with a javascript action:

    +
    + +
    +

    As in the previous example, the button element is given a unique id attribute; a script uses the Document Object Model (DOM) to find the button element by its id and add the onclick handler. The action attribute of the enclosing form element contains a script that will perform the action on the server.

    + + \ No newline at end of file diff --git a/working-examples/script-action-links/index.html b/working-examples/script-action-links/index.html new file mode 100644 index 0000000000..dd0cde6228 --- /dev/null +++ b/working-examples/script-action-links/index.html @@ -0,0 +1,36 @@ + + + + + + Creating Action Links using JavaScript + + + +

    Here is the link to modify with a javascript action: + Link to invoke JavaScript.

    + +

    The anchor element on the page is given a unique id attribute. The href attribute of the anchor element should contain a valid URI that will perform the action on the server or will load a Web page that explains that JavaScript is required to interact with the site. A script uses the Document Object Model (DOM) to find the anchor element by its id and add the onclick handler to the anchor element. Note that the anchor element must be loaded into the DOM before it can be found and modified. This is usually accomplished by calling the script from the onload event of the body element. The script to add the onclick event handler will only execute if the user agent supports and has JavaScript enabled. The unmodified anchor element will be used if the user agent does not support JavaScript. Using JavaScript to add the action to the anchor element will ensure that the user is not confused by an unresponsive action if they load the Web page in a user agent which does not support JavaScript.

    +

    + diff --git a/working-examples/script-action-on-div/index.html b/working-examples/script-action-on-div/index.html new file mode 100644 index 0000000000..7e054eb6e1 --- /dev/null +++ b/working-examples/script-action-on-div/index.html @@ -0,0 +1,62 @@ + + + + + + Creating Divs with Actions using JavaScript + + + + +

    Here is the link to modify with a javascript action:

    +
    + Do Something +
    +
    + + + diff --git a/working-examples/script-change-css-property/index.html b/working-examples/script-change-css-property/index.html new file mode 100644 index 0000000000..04907f2c25 --- /dev/null +++ b/working-examples/script-change-css-property/index.html @@ -0,0 +1,81 @@ + + + + +Using a client-side JavaScript to change a CSS property + + + + + + + + + +

    Product comparison

    +

    The products you selected to compare are listed below. +Any differences between the products are highlighted and italicized.

    +

    Change hightlight color:

    + + + + + + + + + + + + + + + + + + + + + + +
     Product 1Product 2
    Aspect 1YesYes
    Aspect 2YesNo
    Aspect 3YesYes
    + + + diff --git a/working-examples/script-check-multiple-controls/index.html b/working-examples/script-check-multiple-controls/index.html new file mode 100644 index 0000000000..2544583fc9 --- /dev/null +++ b/working-examples/script-check-multiple-controls/index.html @@ -0,0 +1,56 @@ + + + + Validate multiple controls + + + +

    Validate multiple controls

    +

    This page demonstrates validating multiple form controls at once. If there is invalid input, the user is alerted and the form is not submitted.

    +
    +

    + + +

    +

    + + +

    +

    + +

    +
    + + \ No newline at end of file diff --git a/working-examples/script-control-blink/index.html b/working-examples/script-control-blink/index.html new file mode 100644 index 0000000000..fd60d98249 --- /dev/null +++ b/working-examples/script-control-blink/index.html @@ -0,0 +1,35 @@ + + + + +Example of SCR22: Using scripts to control blinking and stop it in five seconds or less + + + + +
    New item!
    + + + diff --git a/working-examples/script-dynamic-select/index.html b/working-examples/script-dynamic-select/index.html new file mode 100644 index 0000000000..142a7abf69 --- /dev/null +++ b/working-examples/script-dynamic-select/index.html @@ -0,0 +1,69 @@ + + + + + +Dynamic Select Statements + + + +

    Dynamic Select Statements

    + + +
    + + + + \ No newline at end of file diff --git a/working-examples/script-enable-alerts/index.html b/working-examples/script-enable-alerts/index.html new file mode 100644 index 0000000000..a3f14a1ea9 --- /dev/null +++ b/working-examples/script-enable-alerts/index.html @@ -0,0 +1,45 @@ + + + + + +Enable Alerts + + + + +

    Press the button below to enable the display of famous quotes using an alert box
    +   +

    + + \ No newline at end of file diff --git a/working-examples/script-expand-links/index.html b/working-examples/script-expand-links/index.html new file mode 100644 index 0000000000..0f09565da2 --- /dev/null +++ b/working-examples/script-expand-links/index.html @@ -0,0 +1,65 @@ + + + + +Providing link expansions on demand + + + +

    Books for download

    +

    + + + diff --git a/working-examples/script-form-validation-2/css/validate.css b/working-examples/script-form-validation-2/css/validate.css new file mode 100644 index 0000000000..eee0f84799 --- /dev/null +++ b/working-examples/script-form-validation-2/css/validate.css @@ -0,0 +1,32 @@ +body +{ + font: normal 100.01%/140% arial, Verdana, helvetica, sans-serif; + color:#000; + background-color: #fff; + margin: 0; + padding: 1em; +} + +a +{ + color: #00c; + background-color: #fff; +} + +form h2 a.submissionerror +{ + color: #000; + background-color: #fff; + text-decoration: none; +} + +fieldset +{ + padding: 1em; +} + +legend +{ + color: #000; + background-color: #fff; +} diff --git a/working-examples/script-form-validation-2/index.php b/working-examples/script-form-validation-2/index.php new file mode 100644 index 0000000000..9937dccfdc --- /dev/null +++ b/working-examples/script-form-validation-2/index.php @@ -0,0 +1,162 @@ +\n"; + + $strSuggestion = $strOptional = $strRating = $strJibberish = $strForename = $strAge = $strEmail = ""; + + if ($_POST) + { + if (isset($_POST['suggestion'])) $strSuggestion = $_POST["suggestion"]; + if (isset($_POST['optemail'])) $strOptional = $_POST["optemail"]; + if (isset($_POST['rating'])) $strRating = $_POST["rating"]; + if (isset($_POST['jibberish'])) $strJibberish = $_POST["jibberish"]; + if (isset($_POST['forename'])) $strForename = $_POST["forename"]; + if (isset($_POST['age'])) $strAge = $_POST["age"]; + if (isset($_POST['email'])) $strEmail = $_POST["email"]; + + if (isset($_POST['signup']) && strlen($_POST["signup"]) > 0) + { + $bSubmitted = true; + + if (strlen($strForename) < 2 || is_numeric($strForename)) + { + $iErrorCount++; + $strError .= "
  • Please enter your forename
    • \n"; + } + + if (!is_numeric($strAge)) + { + $iErrorCount++; + $strError .= "
  • Please enter your age
    • \n"; + } + + if (!preg_match("/^[\w-\.\']{1,}\@([\da-zA-Z-]{1,}\.){1,}[\da-zA-Z-]{2,}$/", $strEmail)) + { + $iErrorCount++; + $strError .= "
  • Please enter your email address
    • \n"; + } + } + else if (strlen($_POST["submit"]) > 0) + { + $bRegion = 1; + $bSubmitted = true; + + if (strlen($strSuggestion) < 2 || is_numeric($strSuggestion)) + { + $iErrorCount++; + $strError .= "
  • Enter a suggestion
    • \n"; + } + + if (strlen($strOptional) > 0 && !preg_match("/^[\w-\.\']{1,}\@([\da-zA-Z-]{1,}\.){1,}[\da-zA-Z-]{2,}$/", $strOptional)) + { + $iErrorCount++; + $strError .= "
  • Please enter your email address (optional)
    • \n"; + } + + if (!is_numeric($strRating)) + { + $iErrorCount++; + $strError .= "
  • Please rate this suggestion
    • \n"; + } + } + + $strError .= "\n"; + + if ($iErrorCount > 0) + $strError = "

    $iErrorCount Errors in Submission

    \n" . $strError; + } +?> + + + + Form Validation + + + + + + +

    Form Validation

    +

    +The following form is validated before being submitted if scripting is available, otherwise the form is validated on the server. All fields are required, except those marked optional. If errors are found in the submission, the form is cancelled and a list of errors is displayed at the top of the form.

    +

    The source code for this example (zip) is available.

    +

     

    + +

    Successful Submission

    +

    +When it comes to filling out web forms, you rock! +

    + 0 && $bRegion == 0) + echo $strError; + + if ($bSubmitted == false || ($bSubmitted == true && $iErrorCount != 0)) { +?> + + +

    +Please enter your details below. +

    + +

    Validating Form

    +
    +
    +
    +Personal Details +

    + + +

    +

    + + +

    +

    + + +

    +
    +

    + +

    +
    + 0 && $bRegion == 1) + echo $strError; + + if ($bSubmitted == false || ($bSubmitted == true && $iErrorCount != 0)) { + +?> +

    Second Form

    +
    +
    +
    +Second Form Details +

    + + +

    +

    + + +

    +

    + + +

    +

    + + +

    +
    +

    + +

    +
    + + + diff --git a/working-examples/script-form-validation-2/scripts/validate.js b/working-examples/script-form-validation-2/scripts/validate.js new file mode 100644 index 0000000000..52d192065d --- /dev/null +++ b/working-examples/script-form-validation-2/scripts/validate.js @@ -0,0 +1,276 @@ +window.onload = initialise; + +function initialise() +{ + var objForms = document.getElementsByTagName('form'); + var iCounter; + + // Attach an event handler for each form + for (iCounter=0; iCounter 0) + { + // If not valid, display error messages + objError = objForm.getElementsByTagName('div'); + + // Look for existing errors + for (iCounter=0; iCounter 0) + { + objAnchor.id = strErrorID; + } + + // Use the label prompt for the error message + objAnchor.appendChild(document.createTextNode(strError)); + // Add keyboard and mouse events to set focus to the form control + objAnchor.onclick = function(event){return focusFormField(this, event);}; + objAnchor.onkeypress = function(event){return focusFormField(this, event);}; + objListItem.appendChild(objAnchor); + objList.appendChild(objListItem); +} + +function focusFormField(objAnchor, objEvent) +{ + var strFormField, objForm; + + // Allow keyboard navigation over links + if (objEvent && objEvent.type == 'keypress') + { + if (objEvent.keyCode != 13 && objEvent.keyCode != 32) + { + return true; + } + } + + // set focus to the form control + strFormField = objAnchor.href.match(/[^#]\w*$/); + objForm = getForm(strFormField); + objForm[strFormField].focus(); + return false; +} + +// Function to return the form element from a given form field name +function getForm(strField) +{ + var objElement = document.getElementById(strField); + + // Find the appropriate form + do + { + objElement = objElement.parentNode; + } while (!objElement.tagName.match(/form/i) && objElement.parentNode); + + return objElement; +} + +// Function to log the error in a list +function logError(objField, objLabel, objList, strErrorID) +{ + var iCounter, strError; + + // Search the label for the error prompt + for (iCounter=0; iCounter + + + ECMAScript Form Validation + + + + +

    Form Validation

    +
    +
    +Numeric Fields +

    + + +

    +

    + + +

    +
    +

    + +

    +
    + + + + + + + diff --git a/working-examples/script-form-validation/validate.js b/working-examples/script-form-validation/validate.js new file mode 100644 index 0000000000..25ac6e8e4d --- /dev/null +++ b/working-examples/script-form-validation/validate.js @@ -0,0 +1,108 @@ +window.onload = initialise; +function initialise() +{ + // Ensure we're working with a relatively standards compliant user agent + if (!document.getElementById || !document.createElement || !document.createTextNode) + return; + + // Add an event handler for the number form + var objForm = document.getElementById('numberform'); + objForm.onsubmit= function(){return validateNumbers(this);}; +} + +function validateNumbers(objForm) +{ + // Test whether fields are valid + var bFirst = isNumber(document.getElementById('num1').value); + var bSecond = isNumber(document.getElementById('num2').value); + // If not valid, display errors + if (!bFirst || !bSecond) + { + var objExisting = document.getElementById('validationerrors'); + var objNew = document.createElement('div'); + var objTitle = document.createElement('h2'); + var objParagraph = document.createElement('p'); + var objList = document.createElement('ol'); + var objAnchor = document.createElement('a'); + var strID = 'firsterror'; + var strError; + // The heading element will contain a link so that screen readers + // can use it to place focus - the destination for the link is + // the first error contained in a list + objAnchor.appendChild(document.createTextNode('Errors in Submission')); + objAnchor.setAttribute('href', '#firsterror'); + objTitle.appendChild(objAnchor); + objParagraph.appendChild(document.createTextNode('Please review the following')); + objNew.setAttribute('id', 'validationerrors'); + objNew.appendChild(objTitle); + objNew.appendChild(objParagraph); + // Add each error found to the list of errors + if (!bFirst) + { + strError = 'Please provide a numeric value for the first number'; + objList.appendChild(addError(strError, '#num1', objForm, strID)); + strID = ''; + } + if (!bSecond) + { + strError = 'Please provide a numeric value for the second number'; + objList.appendChild(addError(strError, '#num2', objForm, strID)); + strID = ''; + } + // Add the list to the error information + objNew.appendChild(objList); + // If there were existing errors, replace them with the new lot, + // otherwise add the new errors to the start of the form + if (objExisting) + objExisting.parentNode.replaceChild(objNew, objExisting); + else + { + var objPosition = objForm.firstChild; + objForm.insertBefore(objNew, objPosition); + } + // Place focus on the anchor in the heading to alert + // screen readers that the submission is in error + objAnchor.focus(); + // Do not submit the form + objForm.submitAllowed = false; + return false; + } + return true; +} + +// Function to validate a number +function isNumber(strValue) +{ + return (!isNaN(strValue) && strValue.replace(/^\s+|\s+$/, '') !== ''); +} + + +// Function to create a list item containing a link describing the error +// that points to the appropriate form field +function addError(strError, strFragment, objForm, strID) +{ + var objAnchor = document.createElement('a'); + var objListItem = document.createElement('li'); + objAnchor.appendChild(document.createTextNode(strError)); + objAnchor.setAttribute('href', strFragment); + objAnchor.onclick = function(event){return focusFormField(this, event, objForm);}; + objAnchor.onkeypress = function(event){return focusFormField(this, event, objForm);}; + // If strID has a value, this is the first error in the list + if (strID.length > 0) + objAnchor.setAttribute('id', strID); + objListItem.appendChild(objAnchor); + return objListItem; +} + +// Function to place focus to the form field in error +function focusFormField(objAnchor, objEvent, objForm) +{ + // Allow keyboard navigation over links + if (objEvent && objEvent.type == 'keypress') + if (objEvent.keyCode != 13 && objEvent.keyCode != 32) + return true; + // set focus to the form control + var strFormField = objAnchor.href.match(/[^#]\w*$/); + objForm[strFormField].focus(); + return false; +} \ No newline at end of file diff --git a/working-examples/script-options-button-dialog/index.html b/working-examples/script-options-button-dialog/index.html new file mode 100644 index 0000000000..201f73932a --- /dev/null +++ b/working-examples/script-options-button-dialog/index.html @@ -0,0 +1,86 @@ + + + +An options button that opens a dialog + + + + + + + +

    Popover - W3C Accessibility Samples

    + +

    Demo

    + +

    You may click the following button to set options.

    + + + +
    +

    Edit Sort Information

    +
    +
    +Sort Order + + + +
    +
    + + +
    +
    +
    + + + diff --git a/working-examples/script-options-button-dialog/shared.js b/working-examples/script-options-button-dialog/shared.js new file mode 100644 index 0000000000..dd4a1d0822 --- /dev/null +++ b/working-examples/script-options-button-dialog/shared.js @@ -0,0 +1,83 @@ +/* shared.js */ + +function HarmonizeEvent(evt) +{ + if (!evt.target) + { + evt.target = evt.srcElement; + if ('mouseover' == evt.type) + { + evt.relatedTarget = evt.fromElement; + } + else if ('mouseout' == evt.type) + { + evt.relatedTarget = evt.toElement; + } + evt.preventDefault = function() { this.returnValue = false; } + evt.stopPropagation = function() { this.cancelBubble = true; } + } +} + +function PositionElement(el,src,right,bottom) +{ + var top = 0; + var left = 0; + if (right) + { + left += src.offsetWidth; + } + if (bottom) + { + top += src.offsetHeight; + } + while (src) + { + top += src.offsetTop; + left += src.offsetLeft; + src = src.offsetParent; + } + el.style.top = top + "px"; + el.style.left = left + "px"; +} + +// Mozilla equivalency + +if (!document.all) +{ + // swapNode() + if ('function' != Node.prototype.swapNode) + { + Node.prototype.swapNode = function (node) + { + var nextSibling = this.nextSibling; + var parentNode = this.parentNode; + node.parentNode.replaceChild(this, node); + parentNode.insertBefore(node, nextSibling); + }; + } + + // click() + if ('function' != HTMLElement.prototype.click) + { + HTMLElement.prototype.click = function() + { + var e = document.createEvent("MouseEvents"); + e.initEvent("click",true,true); + var blnRet = this.dispatchEvent(e); + }; + } + + // contains() + if ('function' != HTMLElement.prototype.contains) + { + HTMLElement.prototype.contains = function (el) + { + while (el!=null && el!=this) + { + el = el.parentElement; + } + return (el!=null) + }; + } + +} \ No newline at end of file diff --git a/working-examples/script-options-button-dialog/style.css b/working-examples/script-options-button-dialog/style.css new file mode 100644 index 0000000000..74ec605b70 --- /dev/null +++ b/working-examples/script-options-button-dialog/style.css @@ -0,0 +1,39 @@ +BODY { + FONT-SIZE: 75%; LINE-HEIGHT: 150%; FONT-FAMILY: verdana, arial, sans-serif +} +H1 { + FONT-SIZE: 150% +} +H2 { + FONT-SIZE: 125% +} +H3 { + FONT-SIZE: 110% +} +INPUT { + FONT-SIZE: 100%; VERTICAL-ALIGN: middle; FONT-FAMILY: verdana, arial, sans-serif +} +BUTTON { + FONT-SIZE: 100%; VERTICAL-ALIGN: middle; FONT-FAMILY: verdana, arial, sans-serif +} +SELECT { + FONT-SIZE: 100%; VERTICAL-ALIGN: middle; FONT-FAMILY: verdana, arial, sans-serif +} +TEXTAREA { + FONT-SIZE: 100%; VERTICAL-ALIGN: middle; FONT-FAMILY: verdana, arial, sans-serif +} +P { + MARGIN-LEFT: 0px +} +FORM { + MARGIN-LEFT: 0px +} +PRE { + MARGIN-LEFT: 0px +} +PRE.code { + PADDING-RIGHT: 5px; PADDING-LEFT: 5px; FONT-SIZE: 100%; PADDING-BOTTOM: 5px; COLOR: #666666; PADDING-TOP: 5px; FONT-FAMILY: courier new, monospace; BACKGROUND-COLOR: #eee +} +.warning { + COLOR: red +} diff --git a/working-examples/script-scroll-pause/index.html b/working-examples/script-scroll-pause/index.html new file mode 100644 index 0000000000..3ffa304140 --- /dev/null +++ b/working-examples/script-scroll-pause/index.html @@ -0,0 +1,27 @@ + + + + + + + + +Example of using script to scroll content and providing mechanism to pause it + + + + + + + + + + + +
    +

    This text will scroll and a Pause/Scroll link will be present when Javascript and CSS are supported and active.

    +
    + + + + diff --git a/working-examples/script-scroll-pause/scroll.css b/working-examples/script-scroll-pause/scroll.css new file mode 100644 index 0000000000..fc7e04791f --- /dev/null +++ b/working-examples/script-scroll-pause/scroll.css @@ -0,0 +1,13 @@ +body {font:1em verdana,sans-serif; color:#000; margin:0} + +/* position:relative and overflow:hidden are required */ +#scroller { position:relative; overflow:hidden; width:15em; border:1px solid #008080; } + +/* add formatting for the scrolling text */ +#tag { margin:2px 0; } + +/* #testP must also contain all text-sizing properties of #tag */ +#testP { visibility:hidden; position:absolute; white-space:nowrap; } + +/* used as a page top marker and to limit width */ +#top { width:350px; margin:auto; } \ No newline at end of file diff --git a/working-examples/script-scroll-pause/scroll.js b/working-examples/script-scroll-pause/scroll.js new file mode 100644 index 0000000000..ca4d0798da --- /dev/null +++ b/working-examples/script-scroll-pause/scroll.js @@ -0,0 +1,112 @@ +var speed=50 // speed of scroller +var step=3 // smoothness of movement +var StartActionText= "Scroll" // Text for start link +var StopActionText = "Pause" // Text for stop link + +var x, scroll, divW, sText="" + +function onclickIE(idAttr,handler,call){ + if ((document.all)&&(document.getElementById)){idAttr[handler]="Javascript:"+call} +} + +function addLink(id,call,txt){ + var e=document.createElement('a') + e.setAttribute('href',call) + var linktext=document.createTextNode(txt) + e.appendChild(linktext) + document.getElementById(id).appendChild(e) +} + +function getElementStyle() { + var elem = document.getElementById('scroller'); + if (elem.currentStyle) { + return elem.currentStyle.overflow; + } else if (window.getComputedStyle) { + var compStyle = window.getComputedStyle(elem, ''); + return compStyle.getPropertyValue("overflow"); + } + return ""; +} + +function addControls(){ + +// test for CSS support first +// test for the overlow property value set in style element or external file + +if (getElementStyle()=="hidden") { + var f=document.createElement('div'); + f.setAttribute('id','controls'); + document.getElementById('scroller').parentNode.appendChild(f); + addLink('controls','Javascript:clickAction(0)',StopActionText); + onclickIE(document.getElementById('controls').childNodes[0],"href",'clickAction(0)'); + document.getElementById('controls').style.display='block'; + } +} + +function stopScroller(){clearTimeout(scroll)} + +function setAction(callvalue,txt){ + var c=document.getElementById('controls') + c.childNodes[0].setAttribute('href','Javascript:clickAction('+callvalue+')') + onclickIE(document.getElementById('controls').childNodes[0],"href",'clickAction('+callvalue+')') + c.childNodes[0].firstChild.nodeValue=txt +} + +function clickAction(no){ + switch(no) { + case 0: + stopScroller(); + setAction(1,StartActionText); + break; + case 1: + startScroller(); + setAction(0,StopActionText); + } +} + + + +function startScroller(){ + document.getElementById('tag').style.whiteSpace='nowrap' + var p=document.createElement('p') + p.id='testP' + p.style.fontSize='25%' //fix for mozilla. multiply by 4 before using + x-=step + if (document.getElementById('tag').className) p.className=document.getElementById('tag').className + p.appendChild(document.createTextNode(sText)) + document.body.appendChild(p) + pw=p.offsetWidth + document.body.removeChild(p) + if (x<(pw*4)*-1){x=divW} + document.getElementById('tag').style.left=x+'px' + scroll=setTimeout('startScroller()',speed) +} + +function initScroller(){ + if (document.getElementById && document.createElement && document.body.appendChild) { + addControls(); + divW=document.getElementById('scroller').offsetWidth; + x=divW; + document.getElementById('tag').style.position='relative'; + document.getElementById('tag').style.left=divW+'px'; + var ss=document.getElementById('tag').childNodes; + for (i=0;i + + Expanding Scrolling Text in Place + + + + + + +

    +

    +
    +
    +

    Four score and +seven years ago our fathers brought forth on this continent, a new +nation, conceived in Liberty, and dedicated to the proposition that +all men are created equal.

    +

    Now we are engaged in a great civil war, testing whether that nation, +or any nation so conceived and so dedicated, can long endure. We are +met on a great battle-field of that war. We have come to dedicate a +portion of that field, as a final resting place for those who here +gave their lives that that nation might live. It is altogether fitting +and proper that we should do this.

    +

    But, in a larger sense, we can not dedicate -- we can not consecrate +-- we can not hallow -- this ground. The brave men, living and dead, +who struggled here, have consecrated it, far above our poor power to +add or detract. The world will little note, nor long remember what we +say here, but it can never forget what they did here. It is for us the +living, rather, to be dedicated here to the unfinished work which they +who fought here have thus far so nobly advanced. It is rather for us +to be here dedicated to the great task remaining before us -- that +from these honored dead we take increased devotion to that cause for +which they gave the last full measure of devotion -- that we here +highly resolve that these dead shall not have died in vain -- that +this nation, under God, shall have a new birth of freedom -- and that +government of the people, by the people, for the people, shall not +perish from the earth.

    +
    +
    + \ No newline at end of file diff --git a/working-examples/script-swap-css/altColors1.css b/working-examples/script-swap-css/altColors1.css new file mode 100644 index 0000000000..801aada6b2 --- /dev/null +++ b/working-examples/script-swap-css/altColors1.css @@ -0,0 +1,5 @@ +@charset "utf-8"; +/* CSS Document */ + +body, h1, h2, h3, p, a { color:#000066; background-color:#FFFFFF; } + diff --git a/working-examples/script-swap-css/altColors2.css b/working-examples/script-swap-css/altColors2.css new file mode 100644 index 0000000000..f9c9543336 --- /dev/null +++ b/working-examples/script-swap-css/altColors2.css @@ -0,0 +1,7 @@ +@charset "utf-8"; +/* CSS Document */ + +body, h1, h2, h3, p, a { color:#FFFF33; background-color:#000000; } + + + diff --git a/working-examples/script-swap-css/altColors3.css b/working-examples/script-swap-css/altColors3.css new file mode 100644 index 0000000000..46503417c2 --- /dev/null +++ b/working-examples/script-swap-css/altColors3.css @@ -0,0 +1,7 @@ +@charset "utf-8"; +/* CSS Document */ + +body, h1, h2, h3, p, a { color:#000000; background-color:#FFFF99; } + + + diff --git a/working-examples/script-swap-css/altColors4.css b/working-examples/script-swap-css/altColors4.css new file mode 100644 index 0000000000..a708ea54f5 --- /dev/null +++ b/working-examples/script-swap-css/altColors4.css @@ -0,0 +1,10 @@ +@charset "utf-8"; +/* CSS Document */ + +body, h1, h2, h3, p, a { color:#000000; background-color:#FFFFFF; } + + + + + + diff --git a/working-examples/script-swap-css/colorswitcher.js b/working-examples/script-swap-css/colorswitcher.js new file mode 100644 index 0000000000..574ea00f8c --- /dev/null +++ b/working-examples/script-swap-css/colorswitcher.js @@ -0,0 +1,7 @@ +// JavaScript Document + +function changeColors (newCSS) +{ + document.getElementById('currentCSS').href = newCSS; + +} diff --git a/working-examples/script-swap-css/defaultColors.css b/working-examples/script-swap-css/defaultColors.css new file mode 100644 index 0000000000..8ff9b2e344 --- /dev/null +++ b/working-examples/script-swap-css/defaultColors.css @@ -0,0 +1,5 @@ +@charset "utf-8"; +/* CSS Document */ + + body, p { color:#000000; background-color:#FFFFFF; } + h1, h2, h3 {color:#990000; background-color:#FFFFFF; } diff --git a/working-examples/script-swap-css/index.html b/working-examples/script-swap-css/index.html new file mode 100644 index 0000000000..a9ae246581 --- /dev/null +++ b/working-examples/script-swap-css/index.html @@ -0,0 +1,30 @@ + + + + +Using a Javascript control to apply a different external CSS file + + + + + + + + + + +
    +

    Conference report

    +

    Last week's conference presented an impressive line-up of speakers...

    +
    + + diff --git a/working-examples/script-swap-css/main.css b/working-examples/script-swap-css/main.css new file mode 100644 index 0000000000..93c07cf2c4 --- /dev/null +++ b/working-examples/script-swap-css/main.css @@ -0,0 +1,14 @@ +@charset "utf-8"; +/* CSS Document */ + +body{ font-family: Geneva, Arial, Helvetica, sans-serif; margin: 2em; } + +#mainbody { padding: 1em; } + +#colorswitch {float: right; width: 12em; border: 1px #000066 solid; padding:0 1em 1em 1em; margin:0;} + +#colorswitch p { padding-top:.5em; font-weight:bold;} + + + + diff --git a/working-examples/script-toggle-navbar-link/index.html b/working-examples/script-toggle-navbar-link/index.html new file mode 100644 index 0000000000..fb2ea52968 --- /dev/null +++ b/working-examples/script-toggle-navbar-link/index.html @@ -0,0 +1,33 @@ + + + + +SCR 28 Example: Toggle navigation bar with a link + + + + + + Toggle Navigation Bar + +
    +

    Here is the main content of the page.

    +
    + + diff --git a/working-examples/script-toggle-toc-button/index.html b/working-examples/script-toggle-toc-button/index.html new file mode 100644 index 0000000000..6f3b6b8c30 --- /dev/null +++ b/working-examples/script-toggle-toc-button/index.html @@ -0,0 +1,55 @@ + + + + +SCR 28 Example: Toggle table of contents with a button + + + + + +

    SCR28 Example: Toggle table of contents with a button

    + +
    +

    Table of Contents

    + +
    + +
    +

    Section 1

    +

    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc id odio ut tortor egestas fermentum. Pellentesque nunc. Nulla a massa id odio lobortis vestibulum. Etiam cursus augue eget lorem. Aliquam pretium nibh. Pellentesque elementum tempor nisi. Nulla ullamcorper, enim eu lacinia ornare, elit massa tempor risus, a lacinia dui dolor sed dolor. Praesent mollis, arcu sed auctor fringilla, sapien pede adipiscing nulla, sed sodales nunc mauris vel ligula. Aliquam convallis, magna in mollis venenatis, urna pede vestibulum leo, sit amet dignissim arcu tortor eget lectus. Aliquam erat volutpat. Etiam tempus egestas tellus. Mauris viverra ante in nisi. Nulla adipiscing nisl ut sem.

    +

    Section 2

    +

    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc id odio ut tortor egestas fermentum. Pellentesque nunc. Nulla a massa id odio lobortis vestibulum. Etiam cursus augue eget lorem. Aliquam pretium nibh. Pellentesque elementum tempor nisi. Nulla ullamcorper, enim eu lacinia ornare, elit massa tempor risus, a lacinia dui dolor sed dolor. Praesent mollis, arcu sed auctor fringilla, sapien pede adipiscing nulla, sed sodales nunc mauris vel ligula. Aliquam convallis, magna in mollis venenatis, urna pede vestibulum leo, sit amet dignissim arcu tortor eget lectus. Aliquam erat volutpat. Etiam tempus egestas tellus. Mauris viverra ante in nisi. Nulla adipiscing nisl ut sem.

    +

    Section 3

    +

    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc id odio ut tortor egestas fermentum. Pellentesque nunc. Nulla a massa id odio lobortis vestibulum. Etiam cursus augue eget lorem. Aliquam pretium nibh. Pellentesque elementum tempor nisi. Nulla ullamcorper, enim eu lacinia ornare, elit massa tempor risus, a lacinia dui dolor sed dolor. Praesent mollis, arcu sed auctor fringilla, sapien pede adipiscing nulla, sed sodales nunc mauris vel ligula. Aliquam convallis, magna in mollis venenatis, urna pede vestibulum leo, sit amet dignissim arcu tortor eget lectus. Aliquam erat volutpat. Etiam tempus egestas tellus. Mauris viverra ante in nisi. Nulla adipiscing nisl ut sem.

    +

    Section 4

    +

    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc id odio ut tortor egestas fermentum. Pellentesque nunc. Nulla a massa id odio lobortis vestibulum. Etiam cursus augue eget lorem. Aliquam pretium nibh. Pellentesque elementum tempor nisi. Nulla ullamcorper, enim eu lacinia ornare, elit massa tempor risus, a lacinia dui dolor sed dolor. Praesent mollis, arcu sed auctor fringilla, sapien pede adipiscing nulla, sed sodales nunc mauris vel ligula. Aliquam convallis, magna in mollis venenatis, urna pede vestibulum leo, sit amet dignissim arcu tortor eget lectus. Aliquam erat volutpat. Etiam tempus egestas tellus. Mauris viverra ante in nisi. Nulla adipiscing nisl ut sem.

    +
    + + diff --git a/working-examples/semantic-text/index.html b/working-examples/semantic-text/index.html new file mode 100644 index 0000000000..1a5b0225fb --- /dev/null +++ b/working-examples/semantic-text/index.html @@ -0,0 +1,26 @@ + + + +Semantic Text Markup Example + + + +

    Using Semantic markup to mark emphasized or special text

    +

    em and strong elements

    +

    ...What she really meant to say was, "This isn't ok, it is excellent!...

    +

    blockquote and cite elements

    +

    The following is an excerpt from the The Story of my Life by Helen Keller

    +
    +

    Even in the days before my teacher came, I used to feel along the square stiff boxwood + hedges, and, guided by the sense of smell, would find the first violets and lilies. + There, too, after a fit of temper, I went to find comfort and to hide my hot face + in the cool leaves and grass.

    +
    +

    q element

    +

    Helen Keller said, Self-pity is our worst enemy and if we yield to it, + we can never do anything good in the world.

    +

    sub and sup elements

    +

    Beth received 1st place in the 9th grade science competition.

    +

    The chemical notation for water is H2O.

    + + \ No newline at end of file diff --git a/working-examples/server-referrer-access-nonconforming/conforming.php b/working-examples/server-referrer-access-nonconforming/conforming.php new file mode 100644 index 0000000000..e6267d3a1e --- /dev/null +++ b/working-examples/server-referrer-access-nonconforming/conforming.php @@ -0,0 +1,11 @@ + + + + + Conforming Content + + +

    This is a conforming page

    +

    From here, you can visit the non-conforming page.

    + + diff --git a/working-examples/server-referrer-access-nonconforming/non-conforming.php b/working-examples/server-referrer-access-nonconforming/non-conforming.php new file mode 100644 index 0000000000..393a6c8aa4 --- /dev/null +++ b/working-examples/server-referrer-access-nonconforming/non-conforming.php @@ -0,0 +1,25 @@ + + + + + + + Non-Conforming Content + + +

    This is a non-conforming page

    +

    Because you came from , you are able to view the content on this page.

    + + + + + diff --git a/working-examples/silverlight-accessible-validation/AccessibleValidation.xap b/working-examples/silverlight-accessible-validation/AccessibleValidation.xap new file mode 100644 index 0000000000..ceff6aa8df Binary files /dev/null and b/working-examples/silverlight-accessible-validation/AccessibleValidation.xap differ diff --git a/working-examples/silverlight-accessible-validation/index.html b/working-examples/silverlight-accessible-validation/index.html new file mode 100644 index 0000000000..caf69c4167 --- /dev/null +++ b/working-examples/silverlight-accessible-validation/index.html @@ -0,0 +1,73 @@ + + + + + AccessibleValidation + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-alternative-audio-channel/AlternativeAudioChannel.xap b/working-examples/silverlight-alternative-audio-channel/AlternativeAudioChannel.xap new file mode 100644 index 0000000000..0281cf7911 Binary files /dev/null and b/working-examples/silverlight-alternative-audio-channel/AlternativeAudioChannel.xap differ diff --git a/working-examples/silverlight-alternative-audio-channel/index.html b/working-examples/silverlight-alternative-audio-channel/index.html new file mode 100644 index 0000000000..6d34e531dc --- /dev/null +++ b/working-examples/silverlight-alternative-audio-channel/index.html @@ -0,0 +1,73 @@ + + + + + AlternativeAudioChannel + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-application-level-key-handling/ApplicationLevelKeyHandling.xap b/working-examples/silverlight-application-level-key-handling/ApplicationLevelKeyHandling.xap new file mode 100644 index 0000000000..4fbbba0229 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/ApplicationLevelKeyHandling.xap differ diff --git a/working-examples/silverlight-application-level-key-handling/index.html b/working-examples/silverlight-application-level-key-handling/index.html new file mode 100644 index 0000000000..ae3a0f5dfd --- /dev/null +++ b/working-examples/silverlight-application-level-key-handling/index.html @@ -0,0 +1,73 @@ + + + + + ApplicationLevelKeyHandling + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-application-level-key-handling/source/Metadata.xml b/working-examples/silverlight-application-level-key-handling/source/Metadata.xml new file mode 100644 index 0000000000..865ce8a6a1 --- /dev/null +++ b/working-examples/silverlight-application-level-key-handling/source/Metadata.xml @@ -0,0 +1,40 @@ + + + 0.683757839154774 + + C:\Documents and Settings\samlan\My Documents\Expression\Deep Zoom Composer Projects\sampleProject\source images\flower.jpg + 0 + 0.248322147651007 + 0.426006666529119 + 0.447427293064877 + 1 + + + + C:\Documents and Settings\samlan\My Documents\Expression\Deep Zoom Composer Projects\sampleProject\source images\guy_by_the_beach.jpg + 0.284513295996183 + 0 + 0.445908699115547 + 0.447427293064877 + 2 + + + + C:\Documents and Settings\samlan\My Documents\Expression\Deep Zoom Composer Projects\sampleProject\source images\tree_blossoms.jpg + 0.564602007381454 + 0.328859060402685 + 0.435397992618546 + 0.447427293064877 + 3 + + + + C:\Documents and Settings\samlan\My Documents\Expression\Deep Zoom Composer Projects\sampleProject\source images\licorice.jpg + 0.22022604281128 + 0.552572706935123 + 0.437066526416967 + 0.447427293064877 + 4 + + + \ No newline at end of file diff --git a/working-examples/silverlight-application-level-key-handling/source/SparseImageSceneGraph.xml b/working-examples/silverlight-application-level-key-handling/source/SparseImageSceneGraph.xml new file mode 100644 index 0000000000..fe665d62f0 --- /dev/null +++ b/working-examples/silverlight-application-level-key-handling/source/SparseImageSceneGraph.xml @@ -0,0 +1,36 @@ + + + 0.683757839154774 + + C:\Documents and Settings\samlan\My Documents\Expression\Deep Zoom Composer Projects\sampleProject\source images\flower.jpg + 0 + 0.248322147651007 + 0.426006666529119 + 0.447427293064877 + 1 + + + C:\Documents and Settings\samlan\My Documents\Expression\Deep Zoom Composer Projects\sampleProject\source images\guy_by_the_beach.jpg + 0.284513295996183 + 0 + 0.445908699115547 + 0.447427293064877 + 2 + + + C:\Documents and Settings\samlan\My Documents\Expression\Deep Zoom Composer Projects\sampleProject\source images\tree_blossoms.jpg + 0.564602007381454 + 0.328859060402685 + 0.435397992618546 + 0.447427293064877 + 3 + + + C:\Documents and Settings\samlan\My Documents\Expression\Deep Zoom Composer Projects\sampleProject\source images\licorice.jpg + 0.22022604281128 + 0.552572706935123 + 0.437066526416967 + 0.447427293064877 + 4 + + \ No newline at end of file diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output.xml b/working-examples/silverlight-application-level-key-handling/source/dzc_output.xml new file mode 100644 index 0000000000..581a65759f --- /dev/null +++ b/working-examples/silverlight-application-level-key-handling/source/dzc_output.xml @@ -0,0 +1,21 @@ + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/0/0_0.png b/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/0/0_0.png new file mode 100644 index 0000000000..d79230945c Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/0/0_0.png differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/1/0_0.png b/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/1/0_0.png new file mode 100644 index 0000000000..151ac9ac12 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/1/0_0.png differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/2/0_0.png b/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/2/0_0.png new file mode 100644 index 0000000000..d095579955 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/2/0_0.png differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/3/0_0.png b/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/3/0_0.png new file mode 100644 index 0000000000..1989fc3856 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/3/0_0.png differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/4/0_0.png b/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/4/0_0.png new file mode 100644 index 0000000000..428664aa22 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/4/0_0.png differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/5/0_0.png b/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/5/0_0.png new file mode 100644 index 0000000000..e3a6757159 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/5/0_0.png differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/6/0_0.png b/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/6/0_0.png new file mode 100644 index 0000000000..f8a15d5150 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/6/0_0.png differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/7/0_0.png b/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/7/0_0.png new file mode 100644 index 0000000000..773f0a05b6 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/7/0_0.png differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/8/0_0.png b/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/8/0_0.png new file mode 100644 index 0000000000..3c59cbcfe1 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/8/0_0.png differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/8/0_1.png b/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/8/0_1.png new file mode 100644 index 0000000000..a10cb3a73a Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/8/0_1.png differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/8/1_0.png b/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/8/1_0.png new file mode 100644 index 0000000000..1e1b8865bf Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/8/1_0.png differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/8/1_1.png b/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/8/1_1.png new file mode 100644 index 0000000000..fa294d2efa Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_files/8/1_1.png differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower.xml b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower.xml new file mode 100644 index 0000000000..81740e261c --- /dev/null +++ b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower.xml @@ -0,0 +1,4 @@ + + + + diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/0/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/0/0_0.jpg new file mode 100644 index 0000000000..4b010e9765 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/0/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/1/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/1/0_0.jpg new file mode 100644 index 0000000000..de0854ecfc Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/1/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/0_0.jpg new file mode 100644 index 0000000000..019a1609f5 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/0_1.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/0_1.jpg new file mode 100644 index 0000000000..18b0ed956e Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/0_1.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/0_2.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/0_2.jpg new file mode 100644 index 0000000000..8bf461ec88 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/0_2.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/0_3.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/0_3.jpg new file mode 100644 index 0000000000..ee849d2558 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/0_3.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/1_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/1_0.jpg new file mode 100644 index 0000000000..47fc6c0f51 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/1_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/1_1.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/1_1.jpg new file mode 100644 index 0000000000..dc6b92b592 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/1_1.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/1_2.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/1_2.jpg new file mode 100644 index 0000000000..5189ba8165 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/1_2.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/1_3.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/1_3.jpg new file mode 100644 index 0000000000..bd51348cf8 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/1_3.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/2_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/2_0.jpg new file mode 100644 index 0000000000..072194b600 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/2_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/2_1.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/2_1.jpg new file mode 100644 index 0000000000..da7b9ff60e Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/2_1.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/2_2.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/2_2.jpg new file mode 100644 index 0000000000..2043690a14 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/2_2.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/2_3.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/2_3.jpg new file mode 100644 index 0000000000..9e93066cd1 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/10/2_3.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/2/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/2/0_0.jpg new file mode 100644 index 0000000000..0dc7eaec09 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/2/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/3/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/3/0_0.jpg new file mode 100644 index 0000000000..e9e529706e Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/3/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/4/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/4/0_0.jpg new file mode 100644 index 0000000000..29b1d1339d Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/4/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/5/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/5/0_0.jpg new file mode 100644 index 0000000000..203ddd63e9 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/5/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/6/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/6/0_0.jpg new file mode 100644 index 0000000000..a133dcad38 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/6/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/7/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/7/0_0.jpg new file mode 100644 index 0000000000..0e3f37ff0b Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/7/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/8/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/8/0_0.jpg new file mode 100644 index 0000000000..3aab41317a Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/8/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/9/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/9/0_0.jpg new file mode 100644 index 0000000000..3fb8209ad4 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/9/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/9/0_1.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/9/0_1.jpg new file mode 100644 index 0000000000..5ffd79dbbc Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/9/0_1.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/9/1_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/9/1_0.jpg new file mode 100644 index 0000000000..4a9b380909 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/9/1_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/9/1_1.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/9/1_1.jpg new file mode 100644 index 0000000000..e497c6264b Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/flower_files/9/1_1.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach.xml b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach.xml new file mode 100644 index 0000000000..7fe870ecd3 --- /dev/null +++ b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach.xml @@ -0,0 +1,4 @@ + + + + diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/0/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/0/0_0.jpg new file mode 100644 index 0000000000..1f0559f8f4 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/0/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/1/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/1/0_0.jpg new file mode 100644 index 0000000000..4f0c2f6727 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/1/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/0_0.jpg new file mode 100644 index 0000000000..363c865967 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/0_1.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/0_1.jpg new file mode 100644 index 0000000000..8f6318c1fd Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/0_1.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/0_2.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/0_2.jpg new file mode 100644 index 0000000000..fa7a1fd609 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/0_2.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/0_3.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/0_3.jpg new file mode 100644 index 0000000000..021020cdcc Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/0_3.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/1_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/1_0.jpg new file mode 100644 index 0000000000..d5ce1cdead Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/1_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/1_1.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/1_1.jpg new file mode 100644 index 0000000000..d79d19647b Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/1_1.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/1_2.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/1_2.jpg new file mode 100644 index 0000000000..3331b96cdf Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/1_2.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/1_3.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/1_3.jpg new file mode 100644 index 0000000000..6a98f97132 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/1_3.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/2_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/2_0.jpg new file mode 100644 index 0000000000..139adaca03 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/2_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/2_1.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/2_1.jpg new file mode 100644 index 0000000000..5132420404 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/2_1.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/2_2.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/2_2.jpg new file mode 100644 index 0000000000..72b48dd55e Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/2_2.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/2_3.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/2_3.jpg new file mode 100644 index 0000000000..53986f42b5 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/10/2_3.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/2/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/2/0_0.jpg new file mode 100644 index 0000000000..750e2143db Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/2/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/3/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/3/0_0.jpg new file mode 100644 index 0000000000..b4b4bda457 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/3/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/4/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/4/0_0.jpg new file mode 100644 index 0000000000..038816c5f9 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/4/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/5/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/5/0_0.jpg new file mode 100644 index 0000000000..292ce8939d Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/5/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/6/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/6/0_0.jpg new file mode 100644 index 0000000000..e89637210c Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/6/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/7/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/7/0_0.jpg new file mode 100644 index 0000000000..7b7e826ea0 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/7/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/8/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/8/0_0.jpg new file mode 100644 index 0000000000..5a80ba47af Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/8/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/9/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/9/0_0.jpg new file mode 100644 index 0000000000..f20e927cc7 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/9/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/9/0_1.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/9/0_1.jpg new file mode 100644 index 0000000000..db350ebbaf Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/9/0_1.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/9/1_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/9/1_0.jpg new file mode 100644 index 0000000000..ad7967759e Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/9/1_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/9/1_1.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/9/1_1.jpg new file mode 100644 index 0000000000..117e4b65bf Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/guy_by_the_beach_files/9/1_1.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice.xml b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice.xml new file mode 100644 index 0000000000..c4a74dcb5d --- /dev/null +++ b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice.xml @@ -0,0 +1,4 @@ + + + + diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/0/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/0/0_0.jpg new file mode 100644 index 0000000000..6d8ffdeed7 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/0/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/1/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/1/0_0.jpg new file mode 100644 index 0000000000..dca3645e50 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/1/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/0_0.jpg new file mode 100644 index 0000000000..4d7822e01f Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/0_1.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/0_1.jpg new file mode 100644 index 0000000000..2518c17a60 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/0_1.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/0_2.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/0_2.jpg new file mode 100644 index 0000000000..6873d7e4c9 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/0_2.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/0_3.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/0_3.jpg new file mode 100644 index 0000000000..9495d71dc3 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/0_3.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/1_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/1_0.jpg new file mode 100644 index 0000000000..a9e2643d83 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/1_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/1_1.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/1_1.jpg new file mode 100644 index 0000000000..b84594daab Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/1_1.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/1_2.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/1_2.jpg new file mode 100644 index 0000000000..3036c7bc5f Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/1_2.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/1_3.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/1_3.jpg new file mode 100644 index 0000000000..8cbb24e055 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/1_3.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/2_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/2_0.jpg new file mode 100644 index 0000000000..f015846b10 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/2_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/2_1.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/2_1.jpg new file mode 100644 index 0000000000..490b6151c7 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/2_1.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/2_2.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/2_2.jpg new file mode 100644 index 0000000000..490b6151c7 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/2_2.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/2_3.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/2_3.jpg new file mode 100644 index 0000000000..d1a13d5eac Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/10/2_3.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/2/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/2/0_0.jpg new file mode 100644 index 0000000000..d1ebfc184d Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/2/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/3/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/3/0_0.jpg new file mode 100644 index 0000000000..9c4a7d1eab Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/3/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/4/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/4/0_0.jpg new file mode 100644 index 0000000000..e3c268a0f4 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/4/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/5/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/5/0_0.jpg new file mode 100644 index 0000000000..33936fdfdd Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/5/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/6/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/6/0_0.jpg new file mode 100644 index 0000000000..ccb23a7c99 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/6/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/7/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/7/0_0.jpg new file mode 100644 index 0000000000..02ce50ae61 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/7/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/8/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/8/0_0.jpg new file mode 100644 index 0000000000..9d0c0b2028 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/8/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/9/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/9/0_0.jpg new file mode 100644 index 0000000000..8988f8264c Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/9/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/9/0_1.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/9/0_1.jpg new file mode 100644 index 0000000000..a89d9631c5 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/9/0_1.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/9/1_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/9/1_0.jpg new file mode 100644 index 0000000000..41c030c681 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/9/1_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/9/1_1.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/9/1_1.jpg new file mode 100644 index 0000000000..3e1e8a34d7 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/licorice_files/9/1_1.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms.xml b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms.xml new file mode 100644 index 0000000000..fdaac2adb5 --- /dev/null +++ b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms.xml @@ -0,0 +1,4 @@ + + + + diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/0/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/0/0_0.jpg new file mode 100644 index 0000000000..a191e8baf5 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/0/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/1/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/1/0_0.jpg new file mode 100644 index 0000000000..28e333f728 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/1/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/0_0.jpg new file mode 100644 index 0000000000..8beedcad07 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/0_1.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/0_1.jpg new file mode 100644 index 0000000000..2e68225cc4 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/0_1.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/0_2.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/0_2.jpg new file mode 100644 index 0000000000..80bcd4885d Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/0_2.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/0_3.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/0_3.jpg new file mode 100644 index 0000000000..73dc6c5a38 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/0_3.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/1_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/1_0.jpg new file mode 100644 index 0000000000..251d728bf6 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/1_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/1_1.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/1_1.jpg new file mode 100644 index 0000000000..14d77bf30a Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/1_1.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/1_2.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/1_2.jpg new file mode 100644 index 0000000000..b87c9aa360 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/1_2.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/1_3.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/1_3.jpg new file mode 100644 index 0000000000..9039d0c279 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/1_3.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/2_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/2_0.jpg new file mode 100644 index 0000000000..008f31f7dd Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/2_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/2_1.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/2_1.jpg new file mode 100644 index 0000000000..58c905bcc3 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/2_1.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/2_2.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/2_2.jpg new file mode 100644 index 0000000000..16b9d5ff84 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/2_2.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/2_3.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/2_3.jpg new file mode 100644 index 0000000000..8518dad4f3 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/10/2_3.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/2/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/2/0_0.jpg new file mode 100644 index 0000000000..8a12a84887 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/2/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/3/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/3/0_0.jpg new file mode 100644 index 0000000000..8d602e4f68 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/3/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/4/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/4/0_0.jpg new file mode 100644 index 0000000000..344fe132c7 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/4/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/5/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/5/0_0.jpg new file mode 100644 index 0000000000..ee31940bcb Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/5/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/6/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/6/0_0.jpg new file mode 100644 index 0000000000..cc8e5d3b0e Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/6/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/7/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/7/0_0.jpg new file mode 100644 index 0000000000..ca572d45fa Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/7/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/8/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/8/0_0.jpg new file mode 100644 index 0000000000..afae59199e Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/8/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/9/0_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/9/0_0.jpg new file mode 100644 index 0000000000..67b3273176 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/9/0_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/9/0_1.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/9/0_1.jpg new file mode 100644 index 0000000000..4cd435aa76 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/9/0_1.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/9/1_0.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/9/1_0.jpg new file mode 100644 index 0000000000..b8b58076c9 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/9/1_0.jpg differ diff --git a/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/9/1_1.jpg b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/9/1_1.jpg new file mode 100644 index 0000000000..9c786083a4 Binary files /dev/null and b/working-examples/silverlight-application-level-key-handling/source/dzc_output_images/tree_blossoms_files/9/1_1.jpg differ diff --git a/working-examples/silverlight-automation-properties-help-text/AutomationPropertiesHelpText.xap b/working-examples/silverlight-automation-properties-help-text/AutomationPropertiesHelpText.xap new file mode 100644 index 0000000000..b93ec23158 Binary files /dev/null and b/working-examples/silverlight-automation-properties-help-text/AutomationPropertiesHelpText.xap differ diff --git a/working-examples/silverlight-automation-properties-help-text/index.html b/working-examples/silverlight-automation-properties-help-text/index.html new file mode 100644 index 0000000000..8cccf97d01 --- /dev/null +++ b/working-examples/silverlight-automation-properties-help-text/index.html @@ -0,0 +1,73 @@ + + + + + AutomationPropertiesHelpText + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-basic-submit-button/BasicSubmitButton.xap b/working-examples/silverlight-basic-submit-button/BasicSubmitButton.xap new file mode 100644 index 0000000000..40779afee2 Binary files /dev/null and b/working-examples/silverlight-basic-submit-button/BasicSubmitButton.xap differ diff --git a/working-examples/silverlight-basic-submit-button/index.html b/working-examples/silverlight-basic-submit-button/index.html new file mode 100644 index 0000000000..4cd6e2d272 --- /dev/null +++ b/working-examples/silverlight-basic-submit-button/index.html @@ -0,0 +1,73 @@ + + + + + BasicSubmitButton + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-browser-zoom/BrowserZoom.xap b/working-examples/silverlight-browser-zoom/BrowserZoom.xap new file mode 100644 index 0000000000..e2832f69dc Binary files /dev/null and b/working-examples/silverlight-browser-zoom/BrowserZoom.xap differ diff --git a/working-examples/silverlight-browser-zoom/index.html b/working-examples/silverlight-browser-zoom/index.html new file mode 100644 index 0000000000..571f23e04e --- /dev/null +++ b/working-examples/silverlight-browser-zoom/index.html @@ -0,0 +1,73 @@ + + + + + BrowserZoom + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-built-in-key-equivalence/BuiltInKeyEquivalence.xap b/working-examples/silverlight-built-in-key-equivalence/BuiltInKeyEquivalence.xap new file mode 100644 index 0000000000..6c24c23b47 Binary files /dev/null and b/working-examples/silverlight-built-in-key-equivalence/BuiltInKeyEquivalence.xap differ diff --git a/working-examples/silverlight-built-in-key-equivalence/index.html b/working-examples/silverlight-built-in-key-equivalence/index.html new file mode 100644 index 0000000000..379c00fcb7 --- /dev/null +++ b/working-examples/silverlight-built-in-key-equivalence/index.html @@ -0,0 +1,73 @@ + + + + + BuiltInKeyEquivalence + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-button-nontext-text-composition/ButtonNontextTextComposition.xap b/working-examples/silverlight-button-nontext-text-composition/ButtonNontextTextComposition.xap new file mode 100644 index 0000000000..38bb083949 Binary files /dev/null and b/working-examples/silverlight-button-nontext-text-composition/ButtonNontextTextComposition.xap differ diff --git a/working-examples/silverlight-button-nontext-text-composition/index.html b/working-examples/silverlight-button-nontext-text-composition/index.html new file mode 100644 index 0000000000..bca3914dce --- /dev/null +++ b/working-examples/silverlight-button-nontext-text-composition/index.html @@ -0,0 +1,73 @@ + + + + + ButtonNontextTextComposition + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-button-text-alternative/ButtonNontextTextComposition.xap b/working-examples/silverlight-button-text-alternative/ButtonNontextTextComposition.xap new file mode 100644 index 0000000000..e23aa54912 Binary files /dev/null and b/working-examples/silverlight-button-text-alternative/ButtonNontextTextComposition.xap differ diff --git a/working-examples/silverlight-button-text-alternative/index.html b/working-examples/silverlight-button-text-alternative/index.html new file mode 100644 index 0000000000..bca3914dce --- /dev/null +++ b/working-examples/silverlight-button-text-alternative/index.html @@ -0,0 +1,73 @@ + + + + + ButtonNontextTextComposition + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-by-animation-font-size/ByAnimationFontSize.xap b/working-examples/silverlight-by-animation-font-size/ByAnimationFontSize.xap new file mode 100644 index 0000000000..a34ed59e89 Binary files /dev/null and b/working-examples/silverlight-by-animation-font-size/ByAnimationFontSize.xap differ diff --git a/working-examples/silverlight-by-animation-font-size/index.html b/working-examples/silverlight-by-animation-font-size/index.html new file mode 100644 index 0000000000..b0694b3c06 --- /dev/null +++ b/working-examples/silverlight-by-animation-font-size/index.html @@ -0,0 +1,73 @@ + + + + + StyleSwitcherFontSize + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-document-structure/DocumentStructure.xap b/working-examples/silverlight-document-structure/DocumentStructure.xap new file mode 100644 index 0000000000..71ce5825cd Binary files /dev/null and b/working-examples/silverlight-document-structure/DocumentStructure.xap differ diff --git a/working-examples/silverlight-document-structure/index.html b/working-examples/silverlight-document-structure/index.html new file mode 100644 index 0000000000..0bc9c9ed2a --- /dev/null +++ b/working-examples/silverlight-document-structure/index.html @@ -0,0 +1,73 @@ + + + + + DocumentStructure + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-focus-visual-custom-control/FocusVisualCustomControl.dll b/working-examples/silverlight-focus-visual-custom-control/FocusVisualCustomControl.dll new file mode 100644 index 0000000000..d8b73151fb Binary files /dev/null and b/working-examples/silverlight-focus-visual-custom-control/FocusVisualCustomControl.dll differ diff --git a/working-examples/silverlight-focus-visual-custom-control/FocusVisualCustomControl.xap b/working-examples/silverlight-focus-visual-custom-control/FocusVisualCustomControl.xap new file mode 100644 index 0000000000..e5fac169cc Binary files /dev/null and b/working-examples/silverlight-focus-visual-custom-control/FocusVisualCustomControl.xap differ diff --git a/working-examples/silverlight-focus-visual-custom-control/index.html b/working-examples/silverlight-focus-visual-custom-control/index.html new file mode 100644 index 0000000000..fb2645e061 --- /dev/null +++ b/working-examples/silverlight-focus-visual-custom-control/index.html @@ -0,0 +1,73 @@ + + + + + FocusVisualCustomControl + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-focusable-image/FocusableImage.dll b/working-examples/silverlight-focusable-image/FocusableImage.dll new file mode 100644 index 0000000000..b68d04e951 Binary files /dev/null and b/working-examples/silverlight-focusable-image/FocusableImage.dll differ diff --git a/working-examples/silverlight-focusable-image/ImageEquivalent.xap b/working-examples/silverlight-focusable-image/ImageEquivalent.xap new file mode 100644 index 0000000000..26da206828 Binary files /dev/null and b/working-examples/silverlight-focusable-image/ImageEquivalent.xap differ diff --git a/working-examples/silverlight-focusable-image/index.html b/working-examples/silverlight-focusable-image/index.html new file mode 100644 index 0000000000..036f0e6bfe --- /dev/null +++ b/working-examples/silverlight-focusable-image/index.html @@ -0,0 +1,73 @@ + + + + + ImageEquivalent + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-help-text-and-tool-tip/HelpTextAndToolTip.xap b/working-examples/silverlight-help-text-and-tool-tip/HelpTextAndToolTip.xap new file mode 100644 index 0000000000..68f87a359a Binary files /dev/null and b/working-examples/silverlight-help-text-and-tool-tip/HelpTextAndToolTip.xap differ diff --git a/working-examples/silverlight-help-text-and-tool-tip/index.html b/working-examples/silverlight-help-text-and-tool-tip/index.html new file mode 100644 index 0000000000..b5fd046903 --- /dev/null +++ b/working-examples/silverlight-help-text-and-tool-tip/index.html @@ -0,0 +1,73 @@ + + + + + HelpTextAndToolTip + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-high-contrast/HighContrast.xap b/working-examples/silverlight-high-contrast/HighContrast.xap new file mode 100644 index 0000000000..c4c74a1cdc Binary files /dev/null and b/working-examples/silverlight-high-contrast/HighContrast.xap differ diff --git a/working-examples/silverlight-high-contrast/index.html b/working-examples/silverlight-high-contrast/index.html new file mode 100644 index 0000000000..39c48b1496 --- /dev/null +++ b/working-examples/silverlight-high-contrast/index.html @@ -0,0 +1,73 @@ + + + + + HighContrast + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-labels/Labels.xap b/working-examples/silverlight-labels/Labels.xap new file mode 100644 index 0000000000..19ecb12c8e Binary files /dev/null and b/working-examples/silverlight-labels/Labels.xap differ diff --git a/working-examples/silverlight-labels/index.html b/working-examples/silverlight-labels/index.html new file mode 100644 index 0000000000..246d53ac9f --- /dev/null +++ b/working-examples/silverlight-labels/index.html @@ -0,0 +1,73 @@ + + + + + Labels + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-lang-properties/LangProperties.xap b/working-examples/silverlight-lang-properties/LangProperties.xap new file mode 100644 index 0000000000..52a3515510 Binary files /dev/null and b/working-examples/silverlight-lang-properties/LangProperties.xap differ diff --git a/working-examples/silverlight-lang-properties/index.html b/working-examples/silverlight-lang-properties/index.html new file mode 100644 index 0000000000..e6ce0ee1a3 --- /dev/null +++ b/working-examples/silverlight-lang-properties/index.html @@ -0,0 +1,73 @@ + + + + + LangProperties + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-media-element-controls-auto-play/MediaElementControlsAutoPlay.xap b/working-examples/silverlight-media-element-controls-auto-play/MediaElementControlsAutoPlay.xap new file mode 100644 index 0000000000..a233827fb5 Binary files /dev/null and b/working-examples/silverlight-media-element-controls-auto-play/MediaElementControlsAutoPlay.xap differ diff --git a/working-examples/silverlight-media-element-controls-auto-play/index.html b/working-examples/silverlight-media-element-controls-auto-play/index.html new file mode 100644 index 0000000000..e8e3b5824a --- /dev/null +++ b/working-examples/silverlight-media-element-controls-auto-play/index.html @@ -0,0 +1,73 @@ + + + + + MediaElementControlsAutoPlay + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-media-element-controls/MediaElementControls.xap b/working-examples/silverlight-media-element-controls/MediaElementControls.xap new file mode 100644 index 0000000000..955dfb8c5b Binary files /dev/null and b/working-examples/silverlight-media-element-controls/MediaElementControls.xap differ diff --git a/working-examples/silverlight-media-element-controls/index.html b/working-examples/silverlight-media-element-controls/index.html new file mode 100644 index 0000000000..ef74ef18c9 --- /dev/null +++ b/working-examples/silverlight-media-element-controls/index.html @@ -0,0 +1,73 @@ + + + + + MediaElementControls + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-media-timeline-markers/MediaTimelineMarkers.xap b/working-examples/silverlight-media-timeline-markers/MediaTimelineMarkers.xap new file mode 100644 index 0000000000..599a74f497 Binary files /dev/null and b/working-examples/silverlight-media-timeline-markers/MediaTimelineMarkers.xap differ diff --git a/working-examples/silverlight-media-timeline-markers/index.html b/working-examples/silverlight-media-timeline-markers/index.html new file mode 100644 index 0000000000..7bcd697679 --- /dev/null +++ b/working-examples/silverlight-media-timeline-markers/index.html @@ -0,0 +1,73 @@ + + + + + MediaTimelineMarkers + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-pause-bouncy-ball/PauseBouncyBall.xap b/working-examples/silverlight-pause-bouncy-ball/PauseBouncyBall.xap new file mode 100644 index 0000000000..dfee2ea738 Binary files /dev/null and b/working-examples/silverlight-pause-bouncy-ball/PauseBouncyBall.xap differ diff --git a/working-examples/silverlight-pause-bouncy-ball/index.html b/working-examples/silverlight-pause-bouncy-ball/index.html new file mode 100644 index 0000000000..ee8cdb781e --- /dev/null +++ b/working-examples/silverlight-pause-bouncy-ball/index.html @@ -0,0 +1,73 @@ + + + + + PauseBouncyBall + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-programmatic-focus/ProgrammaticFocus.xap b/working-examples/silverlight-programmatic-focus/ProgrammaticFocus.xap new file mode 100644 index 0000000000..52840f6900 Binary files /dev/null and b/working-examples/silverlight-programmatic-focus/ProgrammaticFocus.xap differ diff --git a/working-examples/silverlight-programmatic-focus/index.html b/working-examples/silverlight-programmatic-focus/index.html new file mode 100644 index 0000000000..011c8cf696 --- /dev/null +++ b/working-examples/silverlight-programmatic-focus/index.html @@ -0,0 +1,73 @@ + + + + + ProgrammaticFocus + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-replace-audio-with-transcript/ReplaceAudioWithTranscriptText.xap b/working-examples/silverlight-replace-audio-with-transcript/ReplaceAudioWithTranscriptText.xap new file mode 100644 index 0000000000..9ed040f0b1 Binary files /dev/null and b/working-examples/silverlight-replace-audio-with-transcript/ReplaceAudioWithTranscriptText.xap differ diff --git a/working-examples/silverlight-replace-audio-with-transcript/index.html b/working-examples/silverlight-replace-audio-with-transcript/index.html new file mode 100644 index 0000000000..4376ac3f16 --- /dev/null +++ b/working-examples/silverlight-replace-audio-with-transcript/index.html @@ -0,0 +1,73 @@ + + + + + ReplaceAudioWithTranscriptText + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-silver-fish/index.html b/working-examples/silverlight-silver-fish/index.html new file mode 100644 index 0000000000..f6640f1f0a --- /dev/null +++ b/working-examples/silverlight-silver-fish/index.html @@ -0,0 +1,20 @@ + + + SilverFish + + +
    +
    + + + +
    +
    +
    + + + + + + diff --git a/working-examples/silverlight-simple-numeric-up-down/SimpleNumericUpDown.xap b/working-examples/silverlight-simple-numeric-up-down/SimpleNumericUpDown.xap new file mode 100644 index 0000000000..dbfb977df2 Binary files /dev/null and b/working-examples/silverlight-simple-numeric-up-down/SimpleNumericUpDown.xap differ diff --git a/working-examples/silverlight-simple-numeric-up-down/index.html b/working-examples/silverlight-simple-numeric-up-down/index.html new file mode 100644 index 0000000000..791e39c019 --- /dev/null +++ b/working-examples/silverlight-simple-numeric-up-down/index.html @@ -0,0 +1,73 @@ + + + + + KeysNumericUpDown + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-simple-peer-forwarding/SimplePeerForwarding.xap b/working-examples/silverlight-simple-peer-forwarding/SimplePeerForwarding.xap new file mode 100644 index 0000000000..1ff76aec32 Binary files /dev/null and b/working-examples/silverlight-simple-peer-forwarding/SimplePeerForwarding.xap differ diff --git a/working-examples/silverlight-simple-peer-forwarding/index.html b/working-examples/silverlight-simple-peer-forwarding/index.html new file mode 100644 index 0000000000..1ccc05049e --- /dev/null +++ b/working-examples/silverlight-simple-peer-forwarding/index.html @@ -0,0 +1,73 @@ + + + + + SimplePeerForwarding + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-stop-animation/StopAnimation.xap b/working-examples/silverlight-stop-animation/StopAnimation.xap new file mode 100644 index 0000000000..4a187152aa Binary files /dev/null and b/working-examples/silverlight-stop-animation/StopAnimation.xap differ diff --git a/working-examples/silverlight-stop-animation/index.html b/working-examples/silverlight-stop-animation/index.html new file mode 100644 index 0000000000..a1333454ed --- /dev/null +++ b/working-examples/silverlight-stop-animation/index.html @@ -0,0 +1,73 @@ + + + + + StopAnimation + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-style-switcher-font-size/StyleSwitcherFontSize.xap b/working-examples/silverlight-style-switcher-font-size/StyleSwitcherFontSize.xap new file mode 100644 index 0000000000..4d88e9f662 Binary files /dev/null and b/working-examples/silverlight-style-switcher-font-size/StyleSwitcherFontSize.xap differ diff --git a/working-examples/silverlight-style-switcher-font-size/index.html b/working-examples/silverlight-style-switcher-font-size/index.html new file mode 100644 index 0000000000..b0694b3c06 --- /dev/null +++ b/working-examples/silverlight-style-switcher-font-size/index.html @@ -0,0 +1,73 @@ + + + + + StyleSwitcherFontSize + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-tab-navigation/TabNavigation.xap b/working-examples/silverlight-tab-navigation/TabNavigation.xap new file mode 100644 index 0000000000..e6e96da72b Binary files /dev/null and b/working-examples/silverlight-tab-navigation/TabNavigation.xap differ diff --git a/working-examples/silverlight-tab-navigation/index.html b/working-examples/silverlight-tab-navigation/index.html new file mode 100644 index 0000000000..3551d29d3e --- /dev/null +++ b/working-examples/silverlight-tab-navigation/index.html @@ -0,0 +1,73 @@ + + + + + TabNavigation + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-tab-sequence-enabled/TabSequence_Enabled.xap b/working-examples/silverlight-tab-sequence-enabled/TabSequence_Enabled.xap new file mode 100644 index 0000000000..df65bb2639 Binary files /dev/null and b/working-examples/silverlight-tab-sequence-enabled/TabSequence_Enabled.xap differ diff --git a/working-examples/silverlight-tab-sequence-enabled/index.html b/working-examples/silverlight-tab-sequence-enabled/index.html new file mode 100644 index 0000000000..c12eca2391 --- /dev/null +++ b/working-examples/silverlight-tab-sequence-enabled/index.html @@ -0,0 +1,73 @@ + + + + + TabSequenceEnabled + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-tab-sequence-tab-index/TabSequence_Tabindex.xap b/working-examples/silverlight-tab-sequence-tab-index/TabSequence_Tabindex.xap new file mode 100644 index 0000000000..b0ae7d9ddf Binary files /dev/null and b/working-examples/silverlight-tab-sequence-tab-index/TabSequence_Tabindex.xap differ diff --git a/working-examples/silverlight-tab-sequence-tab-index/index.html b/working-examples/silverlight-tab-sequence-tab-index/index.html new file mode 100644 index 0000000000..829cea89fc --- /dev/null +++ b/working-examples/silverlight-tab-sequence-tab-index/index.html @@ -0,0 +1,73 @@ + + + + + TabSequence_TabIndex + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-tab-sequence/TabSequence.xap b/working-examples/silverlight-tab-sequence/TabSequence.xap new file mode 100644 index 0000000000..1038372bbe Binary files /dev/null and b/working-examples/silverlight-tab-sequence/TabSequence.xap differ diff --git a/working-examples/silverlight-tab-sequence/index.html b/working-examples/silverlight-tab-sequence/index.html new file mode 100644 index 0000000000..56ddc47d71 --- /dev/null +++ b/working-examples/silverlight-tab-sequence/index.html @@ -0,0 +1,73 @@ + + + + + TabSequence + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight-visible-focus-template/VisibleFocusTemplate.xap b/working-examples/silverlight-visible-focus-template/VisibleFocusTemplate.xap new file mode 100644 index 0000000000..8725d51ae4 Binary files /dev/null and b/working-examples/silverlight-visible-focus-template/VisibleFocusTemplate.xap differ diff --git a/working-examples/silverlight-visible-focus-template/index.html b/working-examples/silverlight-visible-focus-template/index.html new file mode 100644 index 0000000000..f75b2393f6 --- /dev/null +++ b/working-examples/silverlight-visible-focus-template/index.html @@ -0,0 +1,73 @@ + + + + + VisibleFocusTemplate + + + + + +
    +
    + + + + + + + + Get Microsoft Silverlight + +
    +
    + + diff --git a/working-examples/silverlight/screenshot_uia_objecttree.png b/working-examples/silverlight/screenshot_uia_objecttree.png new file mode 100644 index 0000000000..db6414f937 Binary files /dev/null and b/working-examples/silverlight/screenshot_uia_objecttree.png differ diff --git a/working-examples/silverlight/stackpanelbuttonsorder.png b/working-examples/silverlight/stackpanelbuttonsorder.png new file mode 100644 index 0000000000..0d39ced304 Binary files /dev/null and b/working-examples/silverlight/stackpanelbuttonsorder.png differ diff --git a/working-examples/uri-parameter-choose-stylesheet/index.php b/working-examples/uri-parameter-choose-stylesheet/index.php new file mode 100644 index 0000000000..0448896ca1 --- /dev/null +++ b/working-examples/uri-parameter-choose-stylesheet/index.php @@ -0,0 +1,40 @@ + + + + + + +Using PHP $_GET to apply a different external CSS file + + + + + + + + +Switch to Style Sheet Two"; + } +else { + echo "Switch to Style Sheet One"; + } +?> +
    +

    Conference report

    +

    Last week's conference presented an impressive line-up of speakers...

    +
    + + diff --git a/working-examples/uri-parameter-choose-stylesheet/style1.css b/working-examples/uri-parameter-choose-stylesheet/style1.css new file mode 100644 index 0000000000..8ff9b2e344 --- /dev/null +++ b/working-examples/uri-parameter-choose-stylesheet/style1.css @@ -0,0 +1,5 @@ +@charset "utf-8"; +/* CSS Document */ + + body, p { color:#000000; background-color:#FFFFFF; } + h1, h2, h3 {color:#990000; background-color:#FFFFFF; } diff --git a/working-examples/uri-parameter-choose-stylesheet/style2.css b/working-examples/uri-parameter-choose-stylesheet/style2.css new file mode 100644 index 0000000000..6a1eb7d03b --- /dev/null +++ b/working-examples/uri-parameter-choose-stylesheet/style2.css @@ -0,0 +1,5 @@ +@charset "utf-8"; +/* CSS Document */ + +body, h1, h2, h3, p, a { color:#FFFF00; background-color:#000000; } +