Confirmed users
1,396
edits
Accessibility/WebAccessibilityAPI: Difference between revisions
→Accessible Position
| Line 576: | Line 576: | ||
====Construction==== | ====Construction==== | ||
Construction by accessible element and offset relative it. | |||
<code> | <code> | ||
AccessiblePos .''Constructor''(AccessibleElement, Offset, AccessibleElement) | AccessiblePos .''Constructor''(AccessibleElement, Offset, AccessibleElement) | ||
| Line 588: | Line 591: | ||
</code> | </code> | ||
The offset may be either a number, a numeric mapping of caret position in the content, or a literal. | |||
<pre> | <pre> | ||
| Line 593: | Line 598: | ||
enum OffsetLiterals { | enum OffsetLiterals { | ||
"before", | "before", | ||
" | "begin", | ||
"at", | "at", | ||
" | "end", | ||
"after" | "after" | ||
}; | }; | ||
| Line 602: | Line 607: | ||
<code> | <code> | ||
OffsetLiterals .''before'' | OffsetLiterals .''before'' | ||
::Used to set the accessible position right before the accessible element beginning | ::Used to set the accessible position right before the accessible element beginning. | ||
</code> | </code> | ||
<code> | <code> | ||
OffsetLiterals .'' | OffsetLiterals .''begin'' | ||
::Used to set the accessible position right after the accessible element beginning | ::Used to set the accessible position right after the accessible element beginning. | ||
</code> | </code> | ||
<code> | <code> | ||
OffsetLiterals .''at'' | OffsetLiterals .''at'' | ||
::Used to set the accessible position at the accessible element | ::Used to set the accessible position at the accessible element. | ||
</code> | </code> | ||
<code> | <code> | ||
OffsetLiterals .'' | OffsetLiterals .''end'' | ||
::Used to set the accessible position right before the accessible element ending | ::Used to set the accessible position right before the accessible element ending. | ||
</code> | </code> | ||
<code> | <code> | ||
OffsetLiterals .''after'' | OffsetLiterals .''after'' | ||
::Used to set the accessible position right after the accessible element ending | ::Used to set the accessible position right after the accessible element ending. | ||
</code> | </code> | ||
<b>Example #1. Input widget.</b> | |||
<pre> | |||
<input id="input" value="Hello"> | |||
<script> | |||
var input = document.getElementById("input").a11ement; | |||
// Position is at the control | |||
var p = new A11ePos(input, "at"); | |||
// Position is in the control text at 0 offset. | |||
p = new A11ePos(input, "begin"); | |||
// Position is in the control text at 5 offset. | |||
p = new A11ePos(input, "end"); | |||
</script> | |||
</pre> | |||
<b>Example #2. Image inside a paragraph.</b> | |||
<pre> | |||
<p id="p">I <img id="img" src="love.png" alt="love"> you</p> | |||
<script> | |||
var img = document.getElementById("img").a11ement; | |||
// The position is right before the image, at 2 offset relative the paragraph. | |||
var p = new A11ePos(img, "before"); | |||
// The position is right after the image, at 3 offset relative the paragraph. | |||
p = new A11ePos(img, "after"); | |||
// The position is at the image, no offset relative the paragraph is applicable. | |||
p = new A11ePos(img, "at"); | |||
p = new A11ePos(img, "begin"); | |||
p = new A11ePos(img, "end"); | |||
</script> | |||
</pre> | |||
<b>Example #3. Table.</b> | |||
<pre> | |||
<table id="table"> | |||
<tr> | |||
<td>cell</td> | |||
</tr> | |||
</table> | |||
<script> | |||
var table = document.getElementById("table").a11ement; | |||
// The position at the table. | |||
var p = new A11ePos(table, "at"); | |||
// The position is in the table, before the row. | |||
var p = new A11ePos(table, "begin"); | |||
// The position is in the table, after the row. | |||
var p = new A11ePos(table, "end"); | |||
// The position is in the table, before the row, numeric offset is ignored. | |||
var p = new A11ePos(table, 1); | |||
</script> | |||
</pre> | |||
Construction from a point on the screen. See [[#Hit_testing|hit testing]] for details. | |||
<code> | <code> | ||
| Line 636: | Line 708: | ||
</code> | </code> | ||
Construction from a DOM node and offset relative it. See [[#Caret_and_selection|selection]] for examples. | |||
<code> | <code> | ||
| Line 649: | Line 723: | ||
</code> | </code> | ||
Copy constructor. | |||
<code> | <code> | ||
| Line 658: | Line 734: | ||
</code> | </code> | ||
====Move through the content==== | ====Move through the content==== | ||