Youtube Sidebar Widget
Using keyboard to open videos (for improved accessibility) (2 posts)

  1. David Hunt
    Posted 3 years ago #


    I'm trying to make this great plugin a little greater, by improving accessibility to non-mouse users. What I am trying to do is make a video playable by tabbing through to its thumbnail, then pressing enter when the desired thumbnail is focused.

    So far I have replaced the various permutations of <div class='play_arrow' ...></div> with:

    <a tabindex='0' class='play_arrow' ...><span class='offscreen'>Play $item->title</span></a>

    where the CSS class offscreen is:

    .offscreen{position: absolute; left: -9999em;}

    I also replaced the corresponding mentions of <div> elements in the plugin's script.js and style.css files with <a> elements.

    So far so good ... except that when I use the keyboard to tab through the links on the page to reach the video thumbnail, the enter key does not play with focused video. Nothing happens -- and no Javascript errors are reported in Chrome's console.

    Does anyone have any insight into why this approach has not been successful?


  2. David Hunt
    Posted 3 years ago #

    Ah, I've just realised it does what I want to do if I choose to display the video titles (the titles are keyboard-accessible). That's lovely.

    Still, ideally I would like it to be accessible even if titles are not displayed. Is that possible?

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic