CSS Ders-19 Mouse imleci Değiştirme (cursor)
UstaDerslik Soru-Cevap Yararlı Araçlar
arama ikon
Diller
Türkçe Türkçe

bilgi UstaDerslik
Bu uyari kutusudur.
Tamam
Anasayfa
İletişim
Üyeler

CSS Ders-19 Mouse imleci Değiştirme (cursor)

profil
cArleone
BEĞEN(0)
BEĞENME(0)
GÖRÜNTÜLENME(10866)
RAPOR ET
CSS serimize devam ediyoruz.Bu derste mouse imlecini değiştirmeyi görecez.Mesela link üzerine gelince el işareti çıkmasın yada bizim koyduğumuz bir objede el işareti çıksın gibi her türlü mouse işaretini kontrol edebiliyoruz.Benim en çok kullandığım el işareti çıkarmaktır.Şimdi tek tek inceleyelim.

1-Default
Default verdiğimiz objede normal mouse iconu olan ok gözükür.Kodumuz şu :
cursor:default;


Görüntüsü :
http://ustaderslik.com/resim/ders/sc7t8.gif

2-Pointer
Pointer el işareti oluyo.Bir yere tıklattınca işlem yaptıracaksanız oraya verin.Tıklama dürtüsünü devreye sokuyor bu el.Kodumuz şu :
cursor:pointer;

Görüntüsü :
http://ustaderslik.com/resim/ders/sc7u9.gif

3-Move
Obje hareket ettirmek için kullanılan bir imleç.Kodumuz şu :
cursor:move;


Görüntüsü :
http://ustaderslik.com/resim/ders/sc7uv.gif

4-Text
Bu imleç mousenin olduğu yerin bir yazı olduğunu belirtiyor.Kodumuz şu :
cursor:text;


Görüntüsü :
http://ustaderslik.com/resim/ders/sc7vb.gif

5-Wait
Bu imleçde bekletmek için kullanılıyor.Kodumuz şu :
cursor:wait;

Görüntüsü :
http://ustaderslik.com/resim/ders/sc7vs.gif

6-Help
Bir konu hakkında yardım alabilecekleri bir alanda kullanabilirsiniz.Kodumuz şu :
cursor:help;

Görüntüsü :
http://ustaderslik.com/resim/ders/sc7w5.gif

7-Kendi imlecimiz
Kendi imlecimizi yapabiliyoruz.Kodumuz şu :
cursor:url(url adresi);

Bunu ayrı bir derste ayrıntılı bir şekilde anlatacam.

NOT : Ben en çok kullanılan imleçleri anlatmaya çalıştım.Daha bir çok imleç var bunları şu adresten bakabilirsiniz. http://www.w3schools.com/cssref/playit.asp?filename=playcss_cursor&preval=crosshair

Genel örnek :
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>cArleone</title>
<style type="text/css">
.kutu{width:100px;height:100px;background:red;cursor:pointer;}
</style>
</head>
<body>

<div class="kutu"></div>

</body>
</html>


Burda kımızı alana gelince el işareti çıkacaktır.




davmaneydi
davmaneydi 3 Yıl Önce Cevaplandı
Hocam bu olayı abartirsak sayfada yavaşlama olurmu
cArleone
cArleone 3 Yıl Önce Cevaplandı
normal imleçleri kullanmakta hiç bir sorun olmaz.Eğer img olarak kullanacaksan,img bouyutu küçük tut.Pek kasma yapmaz.



Kod
Kalın
Vurgu
Resim
Video
Url
CEVAPLA
Tüm Hakları Saklıdır. ©Arleone 2013-2014 UstaDerslik






Giriş
Şifremi Unuttum...
Şifre Talep
  Kuralları Kabul Ediyorum.
Kaydol