E-mail List Archives
Thread: accessible slide out panel?
Number of posts in this thread: 3 (In chronological order)
From: Angela French
Date: Mon, Aug 08 2016 2:00PM
Subject: accessible slide out panel?
No previous message | Next message →
Hello,
I'm hoping someone can point me to an accessible example of a side slide out box. I have seen a number of examples that have the functionality I want but I don't believe they would be accessible.
This is an example of the type of functionality I'm looking for, but this one relies on an image in the CSS so that no alt attribute can be applied.
http://www.building58.com/examples/tabSlideOut.html
Thank you.
Angela French
Internet/Intranet Specialist
Washington State Board for Community and Technical Colleges
360-704-4316
= EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >
www.sbctc.edu<;http://www.sbctc.edu/>;
From: Lovely, Brian (CONT)
Date: Mon, Aug 08 2016 2:09PM
Subject: Re: accessible slide out panel?
← Previous message | Next message →
Well, if that's all the content in the thing, then position the box off-screen with CSS so that it's hidden visually but exposed to screen readers, and hide the triggering element from screen readers with aria-hidden="true". Ideally, it would appear in a logical place in the code order, which should be easy enough since it's positioned absolutely, anyway.
-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Angela French
Sent: Monday, August 08, 2016 4:01 PM
To: WebAim Forum ( = EMAIL ADDRESS REMOVED = )
Subject: [WebAIM] accessible slide out panel?
Hello,
I'm hoping someone can point me to an accessible example of a side slide out box. I have seen a number of examples that have the functionality I want but I don't believe they would be accessible.
This is an example of the type of functionality I'm looking for, but this one relies on an image in the CSS so that no alt attribute can be applied.
http://www.building58.com/examples/tabSlideOut.html
Thank you.
Angela French
Internet/Intranet Specialist
Washington State Board for Community and Technical Colleges
360-704-4316
= EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >
www.sbctc.edu<;http://www.sbctc.edu/>;
The information contained in this e-mail is confidential and/or proprietary to Capital One and/or its affiliates and may only be used solely in performance of work or services for Capital One. The information transmitted herewith is intended only for use by the individual or entity to which it is addressed. If the reader of this message is not the intended recipient, you are hereby notified that any review, retransmission, dissemination, distribution, copying or other use of, or taking of any action in reliance upon this information is strictly prohibited. If you have received this communication in error, please contact the sender and delete the material from your computer.
From: Marc Solomon
Date: Mon, Aug 08 2016 3:02PM
Subject: Re: accessible slide out panel?
← Previous message | No next message
Hi Angela,
I found this code pen on the A11y Patterns site: http://codepen.io/grayghostvisuals/pen/IkmGF. It may prove useful in your research.
Best,
Marc
-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Angela French
Sent: Monday, August 8, 2016 4:01 PM
To: WebAim Forum ( = EMAIL ADDRESS REMOVED = ) < = EMAIL ADDRESS REMOVED = >
Subject: [WebAIM] accessible slide out panel?
Hello,
I'm hoping someone can point me to an accessible example of a side slide out box. I have seen a number of examples that have the functionality I want but I don't believe they would be accessible.
This is an example of the type of functionality I'm looking for, but this one relies on an image in the CSS so that no alt attribute can be applied.
http://www.building58.com/examples/tabSlideOut.html
Thank you.
Angela French
Internet/Intranet Specialist
Washington State Board for Community and Technical Colleges
360-704-4316
= EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >
www.sbctc.edu<;http://www.sbctc.edu/>;