Jquery derslerimize devam ediyoruz.Bu derste
.hover() fonksiyonunu işleyeceğiz.Daha önce
mouseover() ve mouseout() fonksiyonlarını işlemiştik
http://ustaderslik.com/konu/Jquery_Ders-10_.mouseover()_ve_.mouseout()_Kullanımı .Hover() ise bu ikisinin birleşiminden oluşan fonksiyon.Yani mousenin üstüne gelmesini de,üzerinden çekilme olayınıda yakalıyor.Kullanımına geçelim.
$("seçici").hover(function(){
//hover iken olaylar
},function(){
//hover bittiğinde olacak olaylar
})
Bu şekilde hover içine
2 fonksiyon yazarak yakalıyoruz.Her ikisini kullanmak zorunlu değil.Sadece mouseover olayını yakalamak istiyorsak tek fonksiyon yapmamız yeterli.
Yazım kolaylığı için mouseover ve mouseout yerine sadece hoverı kullanabiliriz.
Genel örnek :
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>UstaDerslik</title>
<script type="text/javascript" src="jquery-1.11.1.min.js"></script>
<script>
$(function(){
$("div").hover(function(){
$(this).css("color","#15d4f5");
},function(){
$(this).css("color","#000");
})
})
</script>
<style type="text/css">
div{text-align:center;font-size:50px;}
</style>
</head>
<body>
<div>UstaDerslik</div>
</body>
</html>