HTML5 ile gelen ActiveX, Flash Player, Quicktime gibi web
eklentilerine ihtiyaç duymadan ses ve video gibi medya dosyalarımızın
oynatılabildiği etiketlerdir.
<audio> etiketi
Sayfamızda bir ses dosyası çalmak istediğimizde
kullandığımız etikettir. Daha önceden sayfamızda müzik çalmak için ilk önce
flash player eklentisini eklememiz daha sonra da dosyamızı sayfamıza embed
etmemiz, yani gömmemiz gerekiyordu. Artık tek yapmamız gereken <audio>
etiketini kullanmak.
<audio source src="Cemberimde_Gul_Oya.mp3" type="audio/mpeg" controls autoplay preload loop="true">
</audio>
<br>
<audio source src="Ed_sheeran.mp3" type="audio/mpeg" controls preload loop="true">
</audio>
<video> etiketi
<audio> etiketinde olduğu gibi artık HTML5 ile Flash
eklentisi yüklemenize gerek yok. Sitenize doğrudan <video> etiketi ile
video yükleyebilirsiniz.
<video source src="Paylasmak_guzeldir.mp4" type="video/mp4" controls autoplay preload loop="true">
</video>
<br>
<video source src="teknoloji_esaret.mp4" type="video/mp4" controls preload loop="true">
</video>
etiketi içine yazılan atıflardan bahsedeyim biraz.
controls
atfı ses ve videolarımızın kontrollerinin tarayıcımızda gözükmesini sağlıyor.
preload ile kullanıcı sayfaya girdiğinde müziğin önceden yüklenmesini sağlar/engeller.
source dilimizde kaynak anlamına gelir ve ses ve videolarımız da çalacak parçanın kaynak adreslerini içerir. mp4/ogg/mp3
source src="....."
type atfı ile dosyanın formatını
belirtmeliyiz. video/mp4 audio/mp3 gibi
type="......"
loop
özelliği videonuzun bir döngü içinde sonsuza dek çalışmasını sağlar. true ve false değerleri alır.
autoplay özelliğide ses ve ya videosunuz tarayıcı açıldığında otomatik başlamasını sağlar.
Daha iyi kavramamız için yukarıda ki kodların videolarını çekiyorum arkadaşlar. Burada dikkat etmeniz gereken ses ve videolarınız html kaydettiğiniz dosyada olmalı. Eğer aynı dosyada değil ise daha önceki derslerimizde resim eklemede bahsettiğimiz gibi ilgili dosyanın adresini yazıyoruz.
not: yaptığınız her değişiklikte mutlaka kaydet yapın yoksa çalışmaz.
bir sonraki dersimizde görüşmek üzere esen kalın... ebi
yararlanılan kaynaklar:
Hiç yorum yok:
Yorum Gönder