Bu yazımıda sizlere load olaylarını anlatacağım
Load yani yükleme olayları sayfa yüklendiğinde , tarayıcının boyutu değiştiğinde yapılmasını istediğimiz işlevleri tanımlamak için kullanılır.
Onload olayı sayfa yüklendikten sonra tetiklenir.
<!DOCTYPE html>
<html>
<head>
<script>
function sayfa_yukle() {
alert("Sayfa Yüklendi");
}
</script>
</head>
<body onload="sayfa_yukle()">
<h4>Kodlamak Lazım </h4>
</body>
</html>
Yukardaki kodu çalıştırdığınızda sayfa yüklenmesi tamamlanınca ekranda "Sayfa Yüklendi" şeklinde bir uyarı mesajı çıkacaktır.
Ayrıca bu event'i bir element yüklendiğinde çalışması içinde kullanabiliriz.
<!DOCTYPE html>
<html>
<head>
<script>
function resim_yukle() {
alert("Resim Yüklendi");
}
</script>
</head>
<body>
<img src="kodlamaklazim.gif" onload="resim_yukle()" width="100" height="132">
</body>
</html>
Yukarıdaki kodu çalıştırdığınızda ise resim yüklendikten sonra ekranda Resim yüklendi yazısı yazacaktır uyarı penceresinin içinde.
Eğer yükleme sırasında bir hata çıktıysa onerror olayı ile bu hatayla ilgili detaylara ulaşabiliriz.
<!DOCTYPE html>
<html>
<head>
<script>
function resim_yukleme_hatasi() {
alert('Resim yüklenemedi.');
}
</script>
</head>
<body>
<img src="image.gif" onerror="resim_yukleme_hatasi()">
</body>
</html>
Yukardaki çalışan örnekte resim yolu yanlış olduğu için onerror olayı tetiklendi. Ve ekranda uyarı penceresi içinde Resim yüklenemedi yazısı karşımıza çıktı.
Sayfa kapatıldığı zaman ya da sayfadan çıkıldığı zaman tetiklenen olaydır.
<script type="text/javascript">
function cikma_sayfadan()
{
alert("Gene Bekleriz!");
}
window.onunload = cikma_sayfadan();
</script>
Tarayıcının ya da elementin boyu değiştiğinde tetiklenen olaydır.
<!DOCTYPE html>
<html>
<head>
<script>
function boyut_göster() {
var width = window.outerWidth;
var height = window.outerHeight;
var txt = "Window size: genişlik=" + width + ", yükseklik=" + height;
document.getElementById("ekran_boyutu").innerHTML = txt;
}
</script>
</head>
<body onresize="boyut_goster()">
<p id="ekran_boyutu"></p>
</body>
</html>
Yukardaki kodu çalıştırığınızda eğer tarayıcının boyurunu değiştirirseniz ekranda p elementinin genişliği ve yüksekliği yazacaktır.
26 Yaşında. Araştırmayı seven, bir şeyler öğretmeye meraklı bir Bilgisayar Mühendisi
