Daha önceki "Javascript Olaylar" dersinde, üzerine kod yazacağımız olayları görmüştük.Bu olaylar yaratıcı web tasarımcılar için yeterli değildir. Başka olaylar oluşturmak için event (olay) komutlarından yararlanılır. Olay komutlarının önüne event. kodu getirilir. Bu komutlar sadece IE gözatıcıları tarafından desteklenmektedir. onclickFareyle tıklamayı ifade eder.ondblclickFareyle çift tıklamayı ifade eder.onmouseoverFarenin imleciyle üzerine gelmeyi ifade eder.onmouseoutFarenin imlecini üzerinden çekmeyi ifade eder.onmousedownFare düğmesine basmayı ifade eder.onmouseupFare düğmesini bırakmayı ifade eder.onloadSayfanın yüklenmesini ifade eder.onunloadSayfanın kapatılmasını ifade eder.onchangeForm aracının değişmesini ifade eder.onsubmitForm bilgilerinin gönderilmesini ifade eder.onresetForm bilgilerinin silinmesini ifade eder.onselectForm aracının seçilmesini ifade eder.onblurForm aracının pasif hale geçmesini ifade eder.onfocusForm aracının aktif hale geçmesini ifade eder.access***İstenen karakterin girilmesini ifade eder.tabindexNesnelerin işlem sıralamasını numaralandırır.on***downTuşun basılmasını ifade eder.on***upTuşun salınmasını ifade eder.onfocusTuşun basılıp salınmasını ifade eder.
Sağ Tıklama, Sol Tıklama
Fareyle sağ tıklanıldığında, bir fonksiyon çağırmak için button (düğme) olay komutu kullanılır. event.button şeklinde yazılır ve sol tıklanırsa 1, sağ tıklanırsa 2 değerini alır.
<html>
<head>
<title>Sağ ve sol tıklama,</title>
<script language="JavaScript">
function tikla()
{
if (event.button==1) yazi.innerHTML="Sol tıkladınız "
if (event.button==2) yazi.innerHTML="Sağ tıkladınız "
}
</script>
</head>
<body onmousedown="tikla()">
<a id="yazi">Fareyle sayfanın üzerine tıklayınız.</a>
</body>
</html>
İmlecin Koordinatları
İmlecin sayfadaki konumuna göre kod yazmak isteyebiliriz. İmlecin hangi yatay ve düşey koordinatlarda olduğunu belirlemek için clientX, clientY veya offsetX, offsetY veya x, y olay komutlarından yararlanılır. Kısa bir uygulama yapalım:
<html>
<head>
<title>Pencere koordinatları,</title>
<script language="JavaScript">
function imlec()
{
var a=event.x
var b=event.y
yazi.innerHTML="Pencere Koordinatları = (" + a + ";" + b + ")"
}
</script>
</head>
<body onclick="imlec()">
<h3 id="yazi">Fareyle sayfanın üzerine tıklayınız.</h3>
</body>
</html>
Verdiğimiz diğer kodları da siz deneyin, aynı sonuca ulaşacaksınız. Bu kodların hepsi imlecin, pencerenin sol üst köşesine olan yatay ve düşey mesafeyi piksel cinsinden vermektedir. Eğer pencerenin değil de ekranın sol üst köşesine olan yatay ve düşey mesafeyi edinmek istiyorsak, screenX, screenY komutlarını kullanırız
<html>
<head>
<title>Ekran koordinatları,</title>
<script language="JavaScript">
function imlec()
{
var a=event.screenX
var b=event.screenY
yazi.innerHTML="Ekran Koordinatları = (" + a + ";" + b + ")"
}
</script>
</head>
<body onclick="imlec()">
<h3 id="yazi">Fareyle sayfanın üzerine tıklayınız.</h3>
</body>
</html>
Tuş Fare Kombinasyonları
Tüm erkek giyim moda fırsatları için tıklayın !
Gelişmiş programlarda (MS Office, Adobe Photoshop vb.) tıklamak ile shift"e basarak tıklamak arasında fark vardır. Eğer bu farkı web sayfalarınıza taşımak istiyorsanız event.shift*** olay komutunu kullanabilirsiniz. Bu komut shift tuşuna basılıp, basılmadığını gösterir; eğer onclick durumunda event.shift*** kodu kullanırsanız, kullanıcının tıkladığında shift"e basıp basmadığını kontrol etmiş olursunuz. Aynı şekilde bu kodu onmouseover durumunda kullandığınızda, fareyle nesnenin üzerine gelindiğinde shift"e basılıp, basılmadığını kontrol etmiş oluruz. Bu çeşit fare tuş kombinasyonları türetebiliriz.
<html>
<head>
<title>Tuş fare kombinasyonları,</title>
*********
table {visibility:hidden} </style>
<script language="JavaScript">
function rubai()
{
if (event.shift***==0)
{
hayyam.style.visibility="visible"
yazi.innerHTML="Ey kör! Bu yer, bu gök, bu yıldızlar boştur boş!<br>Bırak onu bunu da gönlünü hoş tut hoş!<br>Şu durmadan kurulup dağılan evrende<br>Bir nefestir alacağın, o da boştur boş!"
}
else
{
var yenisayfa = window.open("", "Yeni_Sayfa", "toolbar=no,********=no,directories=no, status=no, menubar=no,scrollbars=no, resizable=no,copyhistory=no,width=400, height=120")
yenisayfa.********.write("Ey kör! Bu yer, bu gök, bu yıldızlar boştur boş!<br>Bırak onu bunu da gönlünü hoş tut hoş!<br>Şu durmadan kurulup dağılan evrende<br>Bir nefestir alacağın, o da boştur boş!")
}
}
</script>
</head>
<body>
<form>
<p>Düğmeye normal tıklamakla, <b>Shift</b>"e basarak tıklamak arasında fark var.</p>
<input type="button" value="Ömer Hayyam" onclick="rubai()">
</form>
<center><table id="hayyam" cellpadding="5" cellspacing="0" border="0" width="400" bgcolor="#D0BB82">
<tr><td id="yazi">Rubai</td></tr></table></center>
</body>
</html>
Bu uygulamamızda onclick olayında event.shift*** kodu kullandık, böylece fare ile shift tuşunun beraber basılmasına kod yazdık. event.shift***"e 1/0 gibi true/false değerleri verebiliriz. Benzer şekilde Alt ve Ctrl tuşları için şu olay kodlarını kullanabilirsiniz: alt***, ctrl***.
Sağ Tıklama, Sol Tıklama
Fareyle sağ tıklanıldığında, bir fonksiyon çağırmak için button (düğme) olay komutu kullanılır. event.button şeklinde yazılır ve sol tıklanırsa 1, sağ tıklanırsa 2 değerini alır.
<html>
<head>
<title>Sağ ve sol tıklama,</title>
<script language="JavaScript">
function tikla()
{
if (event.button==1) yazi.innerHTML="Sol tıkladınız "
if (event.button==2) yazi.innerHTML="Sağ tıkladınız "
}
</script>
</head>
<body onmousedown="tikla()">
<a id="yazi">Fareyle sayfanın üzerine tıklayınız.</a>
</body>
</html>
İmlecin Koordinatları
İmlecin sayfadaki konumuna göre kod yazmak isteyebiliriz. İmlecin hangi yatay ve düşey koordinatlarda olduğunu belirlemek için clientX, clientY veya offsetX, offsetY veya x, y olay komutlarından yararlanılır. Kısa bir uygulama yapalım:
<html>
<head>
<title>Pencere koordinatları,</title>
<script language="JavaScript">
function imlec()
{
var a=event.x
var b=event.y
yazi.innerHTML="Pencere Koordinatları = (" + a + ";" + b + ")"
}
</script>
</head>
<body onclick="imlec()">
<h3 id="yazi">Fareyle sayfanın üzerine tıklayınız.</h3>
</body>
</html>
Verdiğimiz diğer kodları da siz deneyin, aynı sonuca ulaşacaksınız. Bu kodların hepsi imlecin, pencerenin sol üst köşesine olan yatay ve düşey mesafeyi piksel cinsinden vermektedir. Eğer pencerenin değil de ekranın sol üst köşesine olan yatay ve düşey mesafeyi edinmek istiyorsak, screenX, screenY komutlarını kullanırız
<html>
<head>
<title>Ekran koordinatları,</title>
<script language="JavaScript">
function imlec()
{
var a=event.screenX
var b=event.screenY
yazi.innerHTML="Ekran Koordinatları = (" + a + ";" + b + ")"
}
</script>
</head>
<body onclick="imlec()">
<h3 id="yazi">Fareyle sayfanın üzerine tıklayınız.</h3>
</body>
</html>
Tuş Fare Kombinasyonları
Tüm erkek giyim moda fırsatları için tıklayın !
Gelişmiş programlarda (MS Office, Adobe Photoshop vb.) tıklamak ile shift"e basarak tıklamak arasında fark vardır. Eğer bu farkı web sayfalarınıza taşımak istiyorsanız event.shift*** olay komutunu kullanabilirsiniz. Bu komut shift tuşuna basılıp, basılmadığını gösterir; eğer onclick durumunda event.shift*** kodu kullanırsanız, kullanıcının tıkladığında shift"e basıp basmadığını kontrol etmiş olursunuz. Aynı şekilde bu kodu onmouseover durumunda kullandığınızda, fareyle nesnenin üzerine gelindiğinde shift"e basılıp, basılmadığını kontrol etmiş oluruz. Bu çeşit fare tuş kombinasyonları türetebiliriz.
<html>
<head>
<title>Tuş fare kombinasyonları,</title>
*********
table {visibility:hidden} </style>
<script language="JavaScript">
function rubai()
{
if (event.shift***==0)
{
hayyam.style.visibility="visible"
yazi.innerHTML="Ey kör! Bu yer, bu gök, bu yıldızlar boştur boş!<br>Bırak onu bunu da gönlünü hoş tut hoş!<br>Şu durmadan kurulup dağılan evrende<br>Bir nefestir alacağın, o da boştur boş!"
}
else
{
var yenisayfa = window.open("", "Yeni_Sayfa", "toolbar=no,********=no,directories=no, status=no, menubar=no,scrollbars=no, resizable=no,copyhistory=no,width=400, height=120")
yenisayfa.********.write("Ey kör! Bu yer, bu gök, bu yıldızlar boştur boş!<br>Bırak onu bunu da gönlünü hoş tut hoş!<br>Şu durmadan kurulup dağılan evrende<br>Bir nefestir alacağın, o da boştur boş!")
}
}
</script>
</head>
<body>
<form>
<p>Düğmeye normal tıklamakla, <b>Shift</b>"e basarak tıklamak arasında fark var.</p>
<input type="button" value="Ömer Hayyam" onclick="rubai()">
</form>
<center><table id="hayyam" cellpadding="5" cellspacing="0" border="0" width="400" bgcolor="#D0BB82">
<tr><td id="yazi">Rubai</td></tr></table></center>
</body>
</html>
Bu uygulamamızda onclick olayında event.shift*** kodu kullandık, böylece fare ile shift tuşunun beraber basılmasına kod yazdık. event.shift***"e 1/0 gibi true/false değerleri verebiliriz. Benzer şekilde Alt ve Ctrl tuşları için şu olay kodlarını kullanabilirsiniz: alt***, ctrl***.