En son web geliştirme öğreticiler

HTML Video


HTML Video örneği. Izniyle Big Buck Bunny .

Kendin dene "

HTML Video Oynatma

HTML5 önce, bir web sayfasında videoları göstermek için bir standart yoktu.

HTML5 önce videolar yalnızca bir eklenti ile oynanan olabilir (like flash) .

HTML5 <video> öğesi bir web sayfasında bir video embed standart bir yol belirler.


Tarayıcı Desteği

Tablodaki rakamlar tamamen destekleyen ilk tarayıcı sürümü belirtmek <video> elemanı.

Eleman
<video> 4.0 9.0 3.5 4.0 10.5

HTML <video> Eleman

HTML bir video göstermek için kullanın <video> elemanı:

Örnek

<video width="320" height="240" controls>
  <source src="/html/movie.mp4" type="video/mp4">
  <source src="/html/movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
Kendin dene "

Nasıl çalışır

controls bağlıyor oyun, duraklatma ve hacim gibi, video kontrolleri ekler.

Her zaman dahil etmek iyi bir fikirdir width ve height bağlıyor.

yükseklik ve genişlik ayarlı değilse, tarayıcı video boyutunu bilmiyor. Etki sayfası değişeceğini olacaktır (or flicker) Video yüklenirken.

Arasındaki Metin <video> ve </video> etiketleri yalnızca desteklemeyen tarayıcılarda görüntülenir <video> elemanı.

Birden <source> elemanlar farklı video dosyalarına bağlayabilirsiniz. tarayıcı ilk tanınan biçimini kullanır.


HTML <video> Otomatik Kullan

Bir video otomatik kullanmak başlatmak için autoplay özelliğini:

Örnek

<video width="320" height="240" autoplay>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
Kendin dene "

autoplay nitelik iPad ve iPhone gibi mobil cihazlarda çalışmıyor.


HTML Video - Tarayıcı Desteği

Şu anda 3 desteklenen video formatları için vardır <video> elemanı: MP4, WebM ve Ogg:

Tarayıcı MP4WebMOgg
Internet Explorer YES NO NO
Chrome YES YES YES
Firefox YES YES YES
Safari YES NO NO
Opera YES (from Opera 25) YES YES

HTML Video - Ortam Türleri

Dosya formatı Ortam türü
MP4 video/mp4
WebM video/webm
Ogg video/ogg

HTML Video - Yöntemleri, Özellikleri ve Olaylar

HTML5 için DOM yöntemler, özellikler ve olaylar tanımlar <video> elemanı.

Bu süre ve ses ayarı yanı sıra, yüklemek oynamak ve videoları duraklatmak için izin verir.

vb DOM Bir video oynatmak başladığında sizi uyarabilir olaylar, duraklatıldıysa da vardır

Örnek: JavaScript kullanarak




Video nezaket Big Buck Bunny .

Kendin dene "

Tam DOM Referans için, bizim gidip HTML5 Audio / Video DOM Referans .


HTML5 Video Etiketleri

Etiket Açıklama
<video> Video veya film tanımlar
<source> Gibi medya unsurları için birden çok medya kaynakları, tanımlar <video> ve <audio>
<track> medya oynatıcılar metin parçalarını tanımlar