Üye Girişi Yapınız     


    E-Posta
    

    Şifreniz
    



Şifremi Unuttum


Ana Sayfa Site Hakkında İletişim Ziyaretçi Defteri Döküman İndir Makale Ekle Haber Ekle

     JavaScript’te Mouse Olayları
     admin     27.03.2013     21:09:41

Java Script’te mouse olayları; onMouseOver, onMouseOut, onMouseMove, onMouseDown, onMouseUp olayları olmak üzere çeşitlendirilir. Bu olaylar ne zaman tetiklenir ondan bahsedelim.

onMouseOver : Fare nesne üzerine geldiğinde gerçekleşir.
onMouseOut : Fare nesne üzerinden ayrıldığında gerçekleşir.
onMouseMove : Fare nesne üzerinde gezinirken gerçekleşir. Bu olay Over olayından sonra çalışır.
onMouseDown : Nesne üzerinde farenin tuşuna basıldığı anda çalışır.
onMouseUp : Basılan tuş bırakıldığında çalışır.



 Uygulama-1 : Öncelikle mouse’un konum değişikliğine göre tetiklenen olaylar olan  Over, Out ve Move olaylarını içeren uygulamayı yapalım. Bu uygulama için bir adet  araba.jpg adında resim dosyası kullandım.

 

 

 

 
 

  Uygulama Kodları : 

<html>
<head>
<script type="text/javascript">
var gelen,gelen2;
function islemyap(gelen)
{
  document.getElementById("mesaj").innerHTML =gelen.toString();
}
</script>
</head>
<body>
<img src="araba.jpg" onmouseover="islemyap(’Üzerine Geldi’)" onmouseout="islemyap(’Üzerinden Ayrıldı’)" onmousemove="islemyap(’Üzerinde Geziyor’)" /><br>
<div id="mesaj" style="width:225px; background-color:yellow;font-size=24;"/><br>
</body>
</html>
  

 Uygulama-2 : Bu uygulamada ise farenin tuşuna basılması(onmousedown) ve  basılan tuş bırakılması(onmouseup) olaylarının tetiklenmesi gösterilmektedir.

 
 
 
 
 
 
 
 
 Uygulama Kodları : 
 
<html>
<head>
<script type="text/javascript">
var gelen,gelen2;
function islemyap(gelen)
{
  document.getElementById("mesaj").innerHTML =gelen.toString();
}
</script>
</head>
<body>
  <img src="araba.jpg" onMouseDown="islemyap(’Üzerine Tıklandı’)" onmouseup="islemyap(’Tuş Bırakıldı’)"  /><br>
  <div id="mesaj" style="width:225px; background-color:yellow;font-size=24;"/><br>
</body>
</html>

Facebook'ta Paylaş    
Diğer JavaScript İçerikleri       Tüm Yazılar        Ana Sayfa


  =>Soru Sorun veya Yorum Yazın...

İsim Giriniz :
  

  =>Yapılan Yorumlar...