diff options
author | Lea Verou <lea@verou.me> | 2015-02-28 02:06:42 +0200 |
---|---|---|
committer | Lea Verou <lea@verou.me> | 2015-02-28 02:06:42 +0200 |
commit | adc0a2a66c7f3ce825e78c098aa6128eb3814cd7 (patch) | |
tree | e2b9f43c4d5e1b2000ca9123b60dee795b7b4047 | |
parent | 75834f2e6b9130a9bc1d1b732b71eafaca9ae72b (diff) | |
parent | 2714f034b82f99ef179a026b16e0399cf3c162c9 (diff) | |
download | awesomplete-adc0a2a66c7f3ce825e78c098aa6128eb3814cd7.zip awesomplete-adc0a2a66c7f3ce825e78c098aa6128eb3814cd7.tar.gz awesomplete-adc0a2a66c7f3ce825e78c098aa6128eb3814cd7.tar.bz2 |
Merge pull request #26 from ginader/gh-pages
added a live region that announces the selected item
-rw-r--r-- | awesomplete.css | 5 | ||||
-rw-r--r-- | awesomplete.js | 9 |
2 files changed, 14 insertions, 0 deletions
diff --git a/awesomplete.css b/awesomplete.css index 0046498..3d13a82 100644 --- a/awesomplete.css +++ b/awesomplete.css @@ -1,5 +1,10 @@ [hidden] { display: none; } +.visually-hidden { + position: absolute; + clip: rect(0, 0, 0, 0); +} + div.awesomplete { display: inline-block; position: relative; diff --git a/awesomplete.js b/awesomplete.js index 9b388ef..a1dcd0f 100644 --- a/awesomplete.js +++ b/awesomplete.js @@ -48,6 +48,14 @@ var _ = self.Awesomplete = function (input, o) { inside: this.container }); + this.status = $.create("span", { + className: "visually-hidden", + role: "status", + "aria-live": "assertive", + "aria-relevant": "additions", + inside: this.container + }); + // Bind events $.bind(this.input, { @@ -166,6 +174,7 @@ _.prototype = { if (i > -1 && lis.length > 0) { lis[i].setAttribute("aria-selected", "true"); + this.status.textContent = lis[i].textContent; } }, |