HTML Ses Ekleme-Oynatma(Audio Player)

HTML TEMELLERİ

HTML NEDİR ? HTML Başlık(Heading) HTML Paragraf(Paragraphs) HTML Yazı Stili(Font Style) HTML Yazı Formatları(Format Text) HTML Renk Kodları(Color Codes) HTML Link Verme-Ekleme HTML Resim Ekleme(Add a Image) HTML Tablo Ekleme(Add a Table) HTML Liste Ekleme(Add a List) HTML Web Site Penceresi Ekleme(Iframe) HTML Head ve Meta Etiketleri HTML Semboller(Symbols) HTML Form HTML Form Elemanları(Form Elements) HTML Form Giriş Özellikleri (Form Input Properties)

HTML5
İLERİ SEVİYE

HTML 5 NEDİR? HTML Sayfa Bölümleri HTML Form Giriş(Input) Özellikleri HTML Form Elementleri HTML Form Özellikleri(Form Properties) HTML Canvas Kullanımı HTML SVG Kullanımı HTML Video Ekleme-Oynatma(Video Player) HTML Ses Ekleme-Oynatma(Audio Player)

CSS TEMELİ

CSS NEDİR ? CSS CSS-HTML İlişkisi CSS Backgrounds(Arkaplan) CSS Border(Kenarlık) CSS Margins(Dış Boşluk) CSS Padding(İç Boşluk) CSS Height and Width(Yükseklik ve Genişlik) CSS Box Model(Kutu Modeli) CSS Outline(Dış Çizgi) CSS Text(Metin) CSS Fonts(Yazı) CSS Icons(Ikon) CSS Links CSS List(Liste) CSS Tables(Tablolar) CSS Display(Görüntü-Ekran) CSS Layout - Width and Max-width(Yerleşim - Genişlik ve Max Genişlik) CSS Positon(Durum) CSS Overflow(Taşma) CSS Layout-Float and Clear(Yerleşim - Yön ve Temizliği) CSS Image Opacity / Transparency(Opaklık/Saydamlık) CSS Navigation Bar(Gezinme Menüsü)

html5 audio player code

html5 audio player autoplay

html5 audio player free

html5 audio player events

html5 audio player example

html5 audio player events

html5 audio player options

html5 audio autoplay chrome

html5 audio autoplay firefox

html5 audio autoplay safari

html5 audio loop autoplay

html5 audio in loop

html5 audio play loop

html5 video audio muted

html5 audio internet explorer

html5 audio player internet explorer

opera html5 audio mp3 support

html5 audio tag

html5 audio element

html5 audio chrome

Html


<audio controls>
  <source src="../../sesler/intro.ogg" type="audio/ogg">
  <source src="../../sesler/intro.mp3" type="audio/mpeg">
Tarayıcınız audio elementini desteklemiyor.
</audio>

Html 5' ten önce web sayfalarında ses dosyalarının çalışması için belirli bir etiket yoktu.Ses dosyalarının çalınması için eklentilere(flash gibi) ihtiyaç vardı.Farklı tarayıcılar farklı eklentiler de kullanıyordu.

Ses eklemek de video eklemek kadar kolay aslında aynı şekilde <audio> ve <source> etiketlerinden oluşuyor.Aşağıdaki örnekte basit kullanımını görebilirsiniz.

1- Ses Formatları ve Tarayıcı Desteği

Tarayıcılar üç farklı ses uzantısı(formatı) desteklerler. Bunlar tabloda tarayıcıların ve desteklediği uzantılar şeklinde gösterilmiştir..

TARAYICI	MP3	Wav	Ogg
Internet Explorer	Evet	Hayır	Hayır
Chrome	Evet	Evet	Evet
Firefox	Hayır	Evet	Evet
Safari	Evet	Evet	Hayır
Opera	Hayır	Evet	Evet

2-autoplay Özelliği

Sesin otomatik olarak başlatılması için bu özellik kullanılır.


<audio controls autoplay>
  <source src="../../sesler/intro.ogg" type="audio/ogg">
Tarayıcınız audio elementini desteklemiyor.
</audio>

3-loop Özelliği

Sesin sürekli olarak çalmasını sağlar. Durdurulana kadar ses dosyası çalmaya hep devam edecektir.


<audio controls loop>
  <source src="../../sesler/intro.ogg" type="audio/ogg">
Tarayıcınız audio elementini desteklemiyor.
</audio>

4-muted Özelliği

Sesin sessiz bir şekilde çalmasını sağlar. Tabi sonradan kontrol butonları ile bunu değiştirebilirsiniz.


<audio controls muted>
  <source src="../../sesler/intro.ogg" type="audio/ogg">
Tarayıcınız audio elementini desteklemiyor.
</audio>

Enes KILIÇ
Webmaster