Que signifie «playsinline» dans la vidéo Web?

Online Coding Courses for Kids

L’autre jour, je me suis embrouillé à ce sujet, j’ai cherché une réponse et suis venu vide en trouvant quelque chose de clair. La réponse en fait est assez clair et je me sens un peu idiot de ne pas le savoir.

Avec elle en place, comme ceci:

Navigateurs mobiles, jouera la vidéo là où elle est au lieu de la valeur par défaut, qui est de l’ouvrir en plein écran pendant qu’il joue.

Voici à quoi ça ressemble sans pour autant playsinline:

Voici à quoi ça ressemble avec playsinline:

(Si vous êtes comme moi, vous avez essayé de lire cette vidéo à partir du bouton de lecture de la vidéo dans la vidéo, seulement pour réaliser que c’est ne pas un vrai bouton de lecture. 🤯)

(Pendant que nous obtenons des méta, je m’assure que ces vidéos ci-dessus ont playsinline sur eux ici dans cet article de blog.)

Notez que l’utilisateur a toujours la possibilité d’aller en plein écran avec la vidéo même dans le playsinline scénario, donc je dirais que c’est probablement un choix par défaut intelligent. Ce n’est pas littéralement la valeur par défaut – vous devez l’ajouter, mais vous savez ce que je veux dire.

L’un des endroits où cela apparaît régulièrement est dans la soupe d’attribut qui est nécessaire pour que la vidéo soit un remplacement GIF:

Si tu as tout les quatres de ces attributs, la vidéo sera en fait lue automatiquement (et en boucle) sur les navigateurs mobiles, comme le ferait un GIF, uniquement avec performances bien meilleures. Vous pouvez sauter loop si vous ne le souhaitez pas, mais les trois autres sont requis si vous voulez que l’attribut de lecture automatique fonctionne.

J’ai également appris que la (seule?) Façon d’obtenir une miniature à afficher sur mobile (au moins pour iOS) est d’utiliser un poster attribut. Même si vous preload, vous ne voyez que du blanc vierge à moins d’avoir une affiche.

Sans un poster:

Avec un poster:

mo

Si vous ne pouvez pas être dérangé par une affiche, vous voudrez peut-être lancer un border ou quelque chose sur video éléments de sorte de bloquer visuellement cette zone. Sinon, le bouton de lecture flottant est un peu gênant.

Close Menu