HTML5 işaretlemesine video yerleştirmek basittir, herhangi bir tarayıcı için görüntü yerleştirmekten daha karmaşık değildir. Bu yazıda, mümkün olan en basit video oynatıcısını oluşturmak için yerleşik tarayıcı desteğinden tam olarak yararlanacağız.

Uygulamanın temel çerçevesini koyacağız ve ardından

Ön şartlar

Chrome, Safari veya Internet Explorer 9+ kullanın. Zaman için, tarayıcılar arası video dosyası biçimi sorunları nedeniyle Firefox ve Opera'dan kaçınmanız gerekir. Video elemanının desteği tüm modern tarayıcılarda tutarlı olsa da, MP4 formatı Firefox ve Opera'yı destekliyor. Yapabilirsin uyumluluğu kontrol edin.

Başlamadan önce kullanabileceğiniz bir .mp4 bulmanız gerekecek, eğer elinizde yoksa, çok sayıda ücretsiz mp4 dosyası çevrimiçi bulacaksınız.

Temel çerçeveyi oluşturmak

Aşağıdaki kod, oynatıcıyı oluşturduğunuz çerçevedir. Basit bir düzen oluşturur ve videonun kendisi için bir yer tutucuya sahiptir.

Çalışma dizininizde yeni bir HTML dosyası oluşturmanız ve index.html olarak adlandırmanız, ardından bu kodu eklemeniz gerekir:

HTML5 Video Player

Şimdi, temeli attığımızda, sayfaya bir video ekleyerek, oyuncunun eğlenceli kısmına geçelim.

Web sayfalarına video eklemek için video öğesini kullanma

HTML5’lerin tasarlanmasında amaç

Chrome'da bir HTML5 videosu şöyle görünüyor:

Sonraki listeleme, videoyu görüntülemek için gereken tüm kodları gösterir. Gördüğünüz gibi karmaşık değil.

Bu kodu “ ”Yukarıdaki kodda yorum yapın, [VIDEO SİZİNİ] .mp4 dosyanızın yolunu değiştirdiğinizden ve sayfayı yenilediğinizden emin olun.