Top

HTML 5 Dersleri – Bölüm 12 – Referans – HTML5(ve öncesi de dahil) Olay Özellikleri(event attributes)

HTML 5 Dersleri – Bölüm 12 – Referans – HTML5(ve öncesi de dahil) Olay Özellikleri(event attributes)

Genel Olay Özellikleri

HTML 4; tarayıcıda, olaylara tetikleme izni vermiştir, tıpkı bir elemente tıklayınca çalışan Javascript gibi.

Javascript ve nesneye yönelik HTML de anlatacaklarım listesinde.

Aşağıdaki genel olay özellikler HTML5 içerisinde olayların etkileşimde bulunmasını sağlamakta.

Yeni : HTML5’teki yeni olay özellikleri.


Window(pencere) Olay Özellikleri

Window nesnesi için olay tetikleyicileri.

<body> tag’ına uygulanırlar:

Özellik Değer Tanım
onafterprint  Yeni script Belge basıldıktan sonra çalışır
onbeforeprint  Yeni script Belge basılmadan önce çalışır
onbeforeonload  Yeni script Belge yüklenmeden önce çalışır
onblur script Pencere odaklanmasını kaybedince çalışır
onerror   Yeni script Bir hata gerçekleştiğinde çalışır
onfocus script Pencereye odaklandığında çalışır
onhaschange  Yeni script Belge değiştirildiğinde çalışır
onload script Belge yüklendiğinde
onmessage  Yeni script Mesaj tetiklendiğinde
onoffline  Yeni script Belge çevrimdışı olduğunda
ononline  Yeni script Belge çevrimiçi olduğunda
onpagehide  Yeni script Pencere gizli olduğunda
onpageshow Yeni script Pencere görünür olduğunda
onpopstate  Yeni script Pencerenin tarihi değiştiğinde ya da durumu
onredo  Yeni script Belge bir tekrar yapma işlemine sahne olduğunda
onresize  Yeni script Pencere yeniden boyutlandırıldığında
onstorage  Yeni script Bir belge yüklendiğinde
onundo  Yeni script Belge bir geri alma işlemine sahne olduğunda
onunload  Yeni script Kullanıcı belgeden ayrılınca



Form Olayları

Bir HTML formu içerisinde olay tetiklenir.

Tüm HTML5 elementlerine uygulanır,fakat çoğu form elementlerine uygulanır:

Özellik Değer Tanım
onblur script  bir element odaklanmasını yitirdiğinde
onchange script bir elment değiştiğinde
oncontextmenu Yeni script  bir kaynak menu tetiklendiğinde
onfocus script  Bir elemente odaklanıldığında
onformchange Yeni script  Bir form değiştiğinde
onforminput Yeni script  Bir form kullanıcı veri girişi aldığında
oninput Yeni script  Bir element veri girişi aldığında
oninvalid Yeni script  Bir element doğru olmadığında (invalid)
onreset script  Bir form resetlendiğinde
HTML5 desteklemiyor
onselect script  Bir elment seçildiğinde
onsubmit script Bir form onaylandığında



Klavye Olayları

Olaylar klavye ile tetiklenir.

Tüm HTML5 elementlerine uygulanır.

Özellik Değer Tanım
onkeydown script Bir tuşa basıldığında
onkeypress script Basılı tutulduğunda
onkeyup script Tuşa basma  serbest bırakıldığnda



Mouse(Fare) Olayları

Fare ve benzeri kullanıcı davranışları ile olay tetiklenir:

Tüm HTML5 etiketlerine uygulanır.

Özellik Değer Tanım
onclick script Bir mouse tıkında çalışır
ondblclick script Mouse çift tıklamasında çalışır
ondrag Yeni script  Bir element sürüklendiğinde
ondragend Yeni script  Sürükleme işleminin sonunda
ondragenter Yeni script  Sürüklenen bir element uygun bir hedef bölgeye bırakıldığında
ondragleave Yeni script  Bir element hedeflenmiş bırakma bölgesinden ayrıldığında
ondragover Yeni script  Uygun bırakma noktasının üzerindeyken
ondragstar Yeni script  Sürükleme işleminin başında
ondrop Yeni script  Sürüklenen element bırakılmaya başlandığında
onmousedown script Bir fae butonu basıldığında
onmousemove script Fare işaretçisi hareket ettiğinde
onmouseout script Bir elementin üzerinden fare işaretçisi çıkınca
onmouseover script Fare işaretçisi bir elmentin üzerindeyken
onmouseup script Bir fare butonu bırakıldığında
onmousewheel Yeni script  Farenin tekeri yani scrollu hareket ettiğinde
onscroll Yeni script  Bir elementin kaydırma çubuğu hareket ettiğinde



Media Olayları

Video, imaj ve ses gibi medyalarca tetiklenir.

Tüm HTML5 elementlerine uygulanır, fakat çoğu medya için, ses gibi, gömülüler, imaj,nesne, ve video için:

Özellik Değer Tanım
onabort script  Bir olaydan çıkışta çalışır.
oncanplay Yeni script Medya çalmaya başladığında çalışır fakat buffer(ön yükleme) için donabilir.
oncanplaythrough Yeni script Buffer’dan dolayı donmadan başından sonuna kadar çalınca çalışır.
ondurationchange Yeni script  Medyanın uzunluğu değiştiğinde çalışır.
onemptied Yeni script  Aniden bir medya elementinin kaynağı boş olduğunda çalışır. (network hataları, yüklemedeki hatalar gibi…)
onended Yeni script  Medya sona ulaştığında çalışır.
onerror Yeni script  Bir elementin yüklenmesi sırasında hata gerçekleştiğinde.
onloadeddata Yeni script Medya verisi yüklendiğinde çalışır.
onloadedmetadata Yeni script Medya süreçleri ve verileri yüklendiğinde çalışır.
onloadstart Yeni script Medya verilerini tarayıcı yüklemeye başladığında çalışır.
onpause Yeni script  Medya verisi durdurulduğunda çalışır.
onplay Yeni script  Medya verileri çalmaya başladığında çalışır.
onplaying Yeni script  Medya verileri çalmaya başlayıp devam ettiği süreçte çalışır.
onprogress Yeni script  Tarayıcı medya verilerini çekerken çalışır.
onratechange Yeni script  Medya verileri oynatma derecesi değiştiğinde çalışır.
onreadystatechange Yeni script  Hazır olma durumu değiştiğinde çalışır.
onseeked Yeni script  Bir medya elementinin özelliğini çıkarmaya çalışırken doğru olmaması durumunda durdurması
onseeking Yeni script  Bir medya elementinin özelliğini çıkarmaya çalışırken doğru olması durumunda ortaya çıkarmaya devam etmesi.
onstalled Yeni script  Mdya verisini çekerken yüklenme hatasında durdurma eylemini gerçekleştirmesi.
onsuspend Yeni script Tarayıcı medya verilerini çekmeye başladığında çalışır fakat daha öncesinde tümü çekilmiştir.
ontimeupdate Yeni script Medyanın kendisinin çalma pozisyonu değiştirildiğinde çalışır.
onvolumechange Yeni script Medyanın ses ayarı değiştiğinde hatta susturulduğunda çalışır.
onwaiting Yeni script Medya çalışırken durdurulduğunda çalışır fakat tekrar çalıştırılmak üzere beklenir.


Siz neler düşünüyorsunuz? Yazımızı beğendiyseniz aşağıdaki butonlardan tavsiye edebilirsiniz, paylaşabilirsiniz veya yorumlarınızı sunabilirsiniz. Teşekkürler okuduğunuz için!

Bir önceki yazımız olan HTML 5 Dersleri – Bölüm 11 – Referans HTML Özellikleri(attributes) ve HTML5'teki Yeni Özellikler başlıklı makalemizde attribute, Bölüm ve contenteditable hakkında bilgiler verilmektedir. Daha fazla yazımızı görmek için HYTürkyılmaz Dijital pazarlama ve growth hacking blogu anasayfası'yı ziyaret edebilirsiniz. Yazımızı aşağıdaki paylaşım butonlarıyla paylaşarak sevginizi yayınız! Teşekkürler!

Hasan Yasin Türkyılmaz

Sosyolog, dijital stratejist. Dijital medya, reklam ve growth hacking eğitimleri ve hizmetleri sunarım. PC, konsol fark etmez. Oyun oynamayı severim.

Tüm yazıları - Websitesi

Beni takip edin!:
TwitterFacebookLinkedInPinterestGoogle PlusDiggFlickrStumbleUponYouTubeYelpRedditDelicious