While I wait for all browsers to implement the TRACK element which will let me caption this audio, I thought I'd go ahead and use CSS3 animation to make a MARQUEE style ticker with adaptable scroll speed of the transcript to match the speed of Hubbard speaking. Go ahead and examine the source from which you can grab both .oga and .mp3 versions of the audio: L.Ron Hubbard narrating the Xenu story I don't know if anyone wants to try this with other audio/transcripts, because there are some drawbacks: Without javascript enabled, it's unlikely the audio and ticker will start at exactly the same time, and there's no way to control them, since it's impossible to seek through CSS3 animations like in the audio player, and without javascript there's no detection to have the animation also pause when the audio is paused. Having said that, it still plays when javascript is disabled! It'll play in all modern browsers, by which I mean nothing older than IE10 (CSS3 animations didn't exist in Internet Explorer before version 10), but while the audio and animation will start at the same time (with javascript enabled) and are exactly the same duration, other factors can cause them to get out of sync. So far I've noticed Chromium audio skips a fraction ahead every time you pause/unpause it (with mouse, touchscreen or spacebar), and Opera audio stutters behind on ancient machines with no HW acceleration when the CPU is overly taxed. I have no fucking idea how many times I had to listen to this while I tweaked the animation, even with javascript on there's no way to seek the animation so I had to play from the beginning each time I found one getting ahead of the other, which was about every 6 seconds Because I was minimizing the use of javascript, only when it's paused will it show how far you're in on the right (find the bonus if you're using an unreleased development version of a browser). Feel free to report your experiences with it, there are no pictures but CSS3 could definitely be used to sync a slideshow with this.. by someone else. I'm done.
Silly me, of course the the time and progress bar can also be implemented using CSS3, so here's the new version with that included: L.Ron Hubbard narrates the Xenu story
All non-IE browsers have implemented it, which is good enough. Now that the js cuechange event is in the latest Firefox 47 release, enjoy the ability to switch slideshows using the dropdown while Hubbard narrates the origin of engrams -mod Edit-https://scientology.neocities.org/slideshow.html#3(assume this is a Scientology hot link and wear a condom) Turns out you can embed slides from South Park and four other sources in the one WebVTT track file along with subtitles, using the captions to progress through the slides.
