Który atrybut znacznika włącza odtwarzanie w pętli?

Atrybutem znacznika <video>, który umożliwia automatyczne odtwarzanie filmu w pętli, jest loop. Dodanie tego atrybutu do tagu <video> powoduje, że film po zakończeniu odtwarzania rozpoczyna się ponownie automatycznie, bez konieczności interwencji użytkownika.

Charakterystyka atrybutu loop

• Wartość logiczna (boolean) – atrybut loop nie przyjmuje żadnej wartości; wystarczy samo jego obecność w znaczniku, np. <video loop>;
• Działanie – po zakończeniu odtwarzania, wideo zostaje automatycznie odtworzone od początku, tworząc efekt zapętlenia;
• Kompatybilność – funkcja obsługiwana jest przez wszystkie aktualne przeglądarki internetowe, choć warto testować działanie na różnych urządzeniach przed wdrożeniem na stronie.

Podstawowy przykład zastosowania

<video controls loop width="500">
    <source src="przyklad.mp4" type="video/mp4">
    <source src="przyklad.ogg" type="video/ogg">
    Twoja przeglądarka nie obsługuje elementu wideo.
</video>

W powyższym kodzie:

• controls – udostępnia użytkownikowi podstawowy interfejs sterowania odtwarzaczem (play, pauza, głośność itp.),
• loop – powoduje zapętlenie odtwarzania,
• width – ustala szerokość odtwarzacza w pikselach,
• source – wskazuje źródła pliku wideo w różnych formatach, co poprawia kompatybilność.

Praktyczne zastosowania atrybutu loop

Zapętlone animacje na stronach internetowych

Wideo zapętlone nadaje się do prezentacji tła strony, nowoczesnych banerów czy subtelnych animacji, które powinny być wyświetlane bez przerwy i bez reakcji użytkownika.

<video loop autoplay muted playsinline>
    <source src="animacja-tlo.mp4" type="video/mp4">
</video>

• autoplay – automatyczne uruchomienie odtwarzania,
• muted – wyciszenie dźwięku (konieczne dla automatycznego odtwarzania w większości przeglądarek),
• playsinline – wyłącza przechodzenie wideo w tryb pełnoekranowy na urządzeniach mobilnych.

Wideoinstrukcje i poradniki

Dzięki loop użytkownicy mogą wielokrotnie obejrzeć krótką instrukcję lub prezentację bez konieczności ręcznego wznawiania odtwarzania.

Wyświetlanie filmów reklamowych

Spoty reklamowe zapętlone na monitorach interaktywnych (np. w galeriach handlowych) lub na stronach internetowych mogą odtwarzać materiał w nieskończoność.

Ustawianie pętli za pomocą JavaScript

Jeśli chcesz dynamicznie włączyć lub wyłączyć zapętlenie, możesz użyć JavaScriptu:

<video id="myVideo" controls width="400">
    <source src="przyklad.mp4" type="video/mp4">
</video>
<button onclick="document.getElementById('myVideo').loop=true;">Włącz pętlę</button>
<button onclick="document.getElementById('myVideo').loop=false;">Wyłącz pętlę</button>

W tym przypadku naciśnięcie przycisku ustawia lub usuwa zapętlenie podczas działania strony.

Podsumowanie

Atrybut loop jest najprostszym, deklaratywnym sposobem na automatyczne zapętlenie filmów w elementach <video>. Umożliwia tworzenie atrakcyjnych wizualnie stron oraz ułatwia prezentowanie klipów wideo tam, gdzie powtarzalność treści jest pożądana. Jego użycie można rozszerzyć, łącząc z innymi atrybutami (np. autoplay, muted), co pozwala w pełni kontrolować sposób odtwarzania materiałów filmowych dla użytkowników internetu.