Media players . Documentation
audio.media
.media-relationship(data-next-reading='true')
Par défaut un seul lecteur peut être actif sur la page. En cas de nouveau player, le précédent passera sur pause, à part ce principe de base, les lecteurs sont indépendants entre eux.
Un élément parent bénéficiant de la classe .media-relationship rend ses médias enfants solidaires entre eux, sans pour autant qu'ils soient obligés d'être des élements frères.
data-next-reading=false ajoutera une option "lecture à la suite" dans le menu du player, data-next-reading=true activera cette même option par défaut.
Crédit pour les musiques : Les Mystérieuses Cités d'Or, interprétées par Yannick Rault (lien).
(src='urlError')
Il s'agit ici de tester la fonction "lecture suivante" dans le cas où une erreurs de lecture s'est produite (ici les ressources des players n°2 et n°3 sont volontairement en erreur 404). La lecture passera du lecteur n°1 au lecteur n°4 sans bug.
[streaming] (test)
video.media
Certains des lecteurs présents bénéficient de sous-titres, activés ou non par défaut selon les spécifications natives du code HTML5.
Crédit pour les vidéos : Blender Studio.
.video-youtube
(data-id='pZm94gQBzOQ')
(data-id='uWCGK4nneeU')
(data-id='errorId')
Afin de garder des pages légères les vidéos Youtubes ne sont chargées qu'à la demande de l'utilisateur, lorsque celui-ci clique sur le bouton de lecture.
L'API youtube n'est pas utilisée afin d'éviter les limitations inhérentes à cette dernière en terme de requêtes. Ce qui nous permet aussi de garder notre indépendance face à la nécessité d'une clef d'API.