CSS ile Kendi Fare İmlecinizi Oluşturun
Web sayfanızda kendi hazırladığınız bir resmi fare imleci olarak kullanmak ister misiniz? CSS’in cursor tanımı ile bunu yapmak mümkün. Hem de oldukça rahat.
Detaylar için makalemizin devamına göz atabilirsiniz.
CSS Cursor
CSS’in cursor tanımı yardımıyla birçok fare imlecini istediğimiz şekilde kullanabiliyoruz. Bir örnekle bu yapıyı tanıyalım. Ondan sonra tüm varyasyonları gözden geçirelim. Son olarak da custom cursor oluşturalım.
İlk olarak fare imlecini değiştireceğimiz bir eleman oluşturalım.
<p>Burada uzun bir paragraf bulunduğunu varsayalım.</p>
Şimdi de fareyle bu paragrafın üstüne gelindiğinde değişik bir imleç çıkaralım.
pcursor:pointer
Böylece paragrafın üstüne gelindiğinde, pointer imleci, doğrusu bağlantılarda çıkan el işareti gözükecektir. Geriye kalan öteki fare imleçlerini de hatırlayalım.
Kendi fare imlecimizi web sitemize ekleyelim.
Gene CSS’in cursor tanımını kullanıyoruz. Aynı arkaplan tanımlar şeklinde fare imleci tanımlayacağız.
cursor: url('fotoğraf URL'),auto;
Bu kadar rahat. Şimdi de son olarak Codepen üstünde sizler için hazırlamış olduğumuz örneği görüntüleyelim.