I'm discovering the possibilities of accessibility in Storyline, and I've come up with a very simple question for which I don't seem to find an answer:
When I type some text in the "alt text" case, sometimes it is gray and I don't know what this is supposed to mean. I suspect that it has something to do with multiple occurrences of the same word, but I'm not sure.
Could anyone explain this feature or point out to a reference? Thanks a lot in advance
Storyline captures the content ( of a textfield ) or the original name ( of an image ..eg. image.png ) and uses that as default for its accessibility name. When it is unchanged by the user and thus uses the default it is gray.
You can edit the accessibility name to whatever suits you...then it changes to a non-gray colour.
Accessibility names in Storyline act as lists. So when you enter eg. 'object green a1' and on another element in your Storyline... 'object green a2' you can use querySelectors to get either all or some specific one of these elements.
For example: 4 elements in your Storyline with these acc-names: 'obj green a1' 'obj blue a2' 'obj blue a3' 'obj grey a4'
To select all... let allObjs = document.querySelectorAll("[data-acc-text*='obj']"); remember its an HTMLCollection so you need to use a for loop to process all.
To select only the blue objects: let blueObjects = document.querySelectorAll("[data-acc-text*='obj blue']");
or to select a single object, for example obj blue a2: let singleblueElement = document.querySelector("[data-acc-text='obj blue a2']");
Do notice that using spaces in the accessibility names makes a list out of them... and that the selectors used differ... querySelectorAll + *= for selecting all with a specific name... and querySelector + = for selecting a single element.
Thanks a lot for the detailed answer Math! I'll have to learn more about jQuery (it's been a while since the last time I coded anything) but it looks like a very useful feature.
jQuery is not mentioned anywhere in my answer. JQuery is an optional Javascript library to do many things... mostly related to selecting and editing elements on a HTML page.
If you see this sign $ in javascript code it uses jQuery. Vanilla Javascript is plain javascript without the use of jQuery or anyother 3rd party library to make life easier for developers. The code samples i showed above are all Vanilla Javascript so donot use jQuery. Actually Articulate deliberately removed jQuery from Storyline quite a while ago.
3 Replies
Storyline captures the content ( of a textfield ) or the original name ( of an image ..eg. image.png ) and uses that as default for its accessibility name. When it is unchanged by the user and thus uses the default it is gray.
You can edit the accessibility name to whatever suits you...then it changes to a non-gray colour.
Accessibility names in Storyline act as lists. So when you enter eg. 'object green a1' and on another element in your Storyline...
'object green a2'you can use querySelectors to get either all or some specific one of these elements.For example:
4 elements in your Storyline with these acc-names:
'obj green a1''obj blue a2''obj blue a3''obj grey a4'To select all...
let allObjs = document.querySelectorAll("[data-acc-text*='obj']");remember its an HTMLCollection so you need to use a for loop to process all.
To select only the blue objects:
let blueObjects = document.querySelectorAll("[data-acc-text*='obj blue']");or to select a single object, for example obj blue a2:
let singleblueElement = document.querySelector("[data-acc-text='obj blue a2']");Do notice that using spaces in the accessibility names makes a list out of them...
and that the selectors used differ...
querySelectorAll + *=for selecting all with a specific name...and
querySelector + =for selecting a single element.Kind regards,
Math
Thanks a lot for the detailed answer Math! I'll have to learn more about jQuery (it's been a while since the last time I coded anything) but it looks like a very useful feature.
Have a great day,
Melissa
Hi Melissa,
jQuery is not mentioned anywhere in my answer. JQuery is an optional Javascript library to do many things... mostly related to selecting and editing elements on a HTML page.
If you see this sign $ in javascript code it uses jQuery.
Vanilla Javascript is plain javascript without the use of jQuery or anyother 3rd party library to make life easier for developers. The code samples i showed above are all Vanilla Javascript so donot use jQuery. Actually Articulate deliberately removed jQuery from Storyline quite a while ago.