Hacker News new | past | comments | ask | show | jobs | submit login

I have also enjoyed it. This is really good for accessibility. I suppose you use the "timeupdate" event and "scrollIntoView()" to sync text and audio but I would be interested to read more on how you have achieved this.



Yep, you're exactly right. The SL blog uses Jekyll, so I'm limited to just using a markdown document with some ugly hacks.

Essentially, there's a div before each paragraph specifying the timestamp in its id - all done manually. I use `querySelectorAll` to get a list of those divs, extract the timestamps from the IDs, and store them in an array.

In the audio's `timeUpdate`, I check which paragraph we're on, and if it has changed then scroll to the next sibling of the timestamp div.

No magic bullet sadly!




Consider applying for YC's Spring batch! Applications are open till Feb 11.

Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: