HTML 5 ile Video Oynatıcı Nasıl Yapılır?
HTML 5 ile video oynatıcı nasıl yapılır? Merhaba arkadaşlar bu yazımızda sizlere HTML 5 ile herhangi bir javascript koduna ihtiyaç duymadan internet sitenizde nasıl video oynatabileceğinizi anlatacağız. Lafı fazla uzatmadan dilerseniz HTML 5 video oynatma işlemine dair anlatıma başlayalım. Anlatımda direk olarak sunucunuz içerisinde yer alan bir video dosyasını oynatmayı veya uzak bağlantıda yer alan video dosyasını oynatmayı anlatıyoruz.
İnternet sayfanızda yayınlayacağız video için kullanılan internet tarayıcı sürümünün HTML 5 desteğine sahip olması gerekir. HTML 5 desteği olmayan internet tarayıcılarında video gösterimi yapılamaz.
HTML 5 video desteğini sağlayan tarayıcıları tablo halinde aşağıda görebilirsiniz.
| Tarayıcılar | MP4 | WebM | Ogg |
| Edge | Evet | Evet | Evet |
| Chrome | Evet | Evet | Evet |
| Firefox | Evet | Evet | Evet |
| Safari | Evet | Evet | Hayır |
| Opera | Evet | Evet | Evet |
HTML 5 ile video oynatmak için kullanılacak olan tag <video></video> dır. Video tagı içerisine sunucuda yüklü olan videonun yolunu yazarak gösterilmesini ve izlenmesini sağlıyoruz. HTML 5 ile video gösterme izletme için örnek bir kod kullanımı aşağıda görülebilir.
<video width="640" height="640" controls>
<source src="yucebilgi.mp4" type="video/mp4">
<source src="yucebilgi.ogg" type="video/ogg">
</video>
<video> tagı içerisine aşağıdaki tabloda yer alan komutlar kullanabilir. Örnek bir kullanım olarak;
<video autoplay>
<source src="yucebilgi.mp4" type="video/mp4">
<source src="yucebilgi.ogg" type="video/ogg">
</video>
| Özellik | Değer | Açıklama |
| autoplay | autoplay | Gösterilecek videonun otomatik olarak oynatılması için kullanılır. |
| controls | controls | Video oynatıcısı içerisinde kontrol butonlarının yer almasını sağlar. Oynat, Durdur vb. |
| height | piksel | Video oynatıcısının yüksekliğini ayarlamak için kullanılır. |
| width | piksel | Video oynatıcısının genişliğini ayarlamak için kullanılır. |
| muted | muted | Videonun ses olmaksızın gösterimini sağlamak için kullanılır. |
| src | src | Video oynatıcısında gösterilecek videonun yolunu göstermek için kullanılır. |
| poster | URL | Video oynatıcı üzerinde video oynatılmadan önce resim gösterilmesini sağlar. |
| loop | loop | Video tekrar oynat döngüsüne alınır. |
HTML 5 ile video nasıl oynatılır isimli yazımızın sonuna geldik. Merak ettiğiniz veya eklemek istedikleriniz için yazımızın altına yorum bırakmayı unutmayın. Başka bir yazıda görüşmek üzere…
