Volledig met css aan te passen videospeler(s) - pagina 3

Afwijkingen ten opzichte van pagina 1:
Niet gebruikt: snelheidsregeling en fullscreen. Ook op iOS is de geluidsregeling aanwezig, maar met een rood kruis erdoorheen, omdat die daar dus niet werkt. Voor de afbeeldingen in de knoppen is een achtergrond-afbeelding gebruikt.
Omdat de volgorde van de knoppen op het scherm anders is dan die in de html, is in het JavaScript de tabindex aangepast (een hele simpele aanpassing). Deze aanpassing geldt voor álle video's. Omdat echter niet bij alle video's op deze pagina de volgorde van de knoppen hetzelfde is, is bij de tweede, vierde en vijfde video de tabindex nogmaals aangepast, nu met een eenvoudig scriptje in de html. Op dezelfde manier zijn enkele ARIA-roles bij de eerste, tweede, vijfde en zesde video aangepast..
De tweede video heeft wel fullscreen en snelheidsregeling (met radioknoppen), maar speelduur en afgespeelde tijd ontbreken. De volumesterkte staat op de knop van de sleepbalk.
De derde video heeft geen sleepbalk voor geluid en geen volumesterkte, maar wel een gedeeltelijke snelheidsregeling en fullscreen.
De vierde video heeft geen 5% verder, geen 5% terug en geen sleepbalken, maar wel wordt het percentage van de afgespeelde tijd weergegeven. Een aantal knoppen is hier gecombineerd tot ogenschijnlijk één knop, die in tweeën is gedeeld.
De vijfde video is hetzelfde als de tweede, maar het geluidsvolume ontbreekt en bij de snelheidsregeling zijn achtergrond-afbeeldingen zonder radioknoppen gebruikt.
De zesde video heeft afwijkende kleuren, zowel gewoon als bij focus.