MyBBDepo - Türkiyenin MyBB Deposu Forumuna Hoşgeldiniz
Eğer sitemize yaptığınız ilk ziyaretiniz ise, lütfen öncelikle Forum Kurallarını okuyunuz. Forumumuzda bilgi alışverişinde bulunabilmeniz için Kayıt olmalısınız. Üye olmayanlar forumumuzdan yararlanamazlar.
Eğer zaten kayıtlı kullanıcı iseniz, lütfen kullanıcı adınız ve şifreniz ile, Giriş yapınız. (Sitemize üyelik ücretsizdir).
007combatant avatar
Konuyu Oyla:
  • Derecelendirme: 0/5 - 0 oy
  • 1
  • 2
  • 3
  • 4
  • 5

Derecelendirme: 0/5 - 0 oy

CSS ile fare imlecini değiştirmek (Mouse Cursor)


Sponsor Reklam
media venus

Çevrimdışı 007combatant
 Tarih: 05-06-2012, Saat:17:56
(Son Düzenleme: 05-06-2012, Saat:22:36, Düzenleyen: 007combatant.)
#1
Selamün Aleyküm, Bugün css kullanarak sitemizdeki fare imlecini nasıl değiştireceğimizi anşatmaya çalışacağım.

Fare imlecini değiştirmek istediğiniz yerde yazmanız gereken css kodu
PHP Kod:
cursor:hand
şeklindedir.

Bu css kodunun alacağı değerler şu şekildedir:

url
Bu değer ile kendi tasarladığımız .cur uzantılı imleci tanımlayabiliyoruz.
Kullanım şekli
PHP Kod:
cursor:url('ornek.cur'); 

default
Varsayılan değer bildiğimiz ok şekli imleç. Değiştirdiğimiz imleçten varsayılan değere dönmek için sıkça kullanılır.
Kullanım şekli
PHP Kod:
cursor:default; 

hand
Genellikle link izlenimi veren el şekilli bu imleç, ziyaretçiyi sol tıklamaya güdüler.
Kullanım şekli
PHP Kod:
cursor:hand

crosshair
Ziyaretçiyi bir noktayı belirlemesi (nişan alması) yönünde güdüler.
Kullanım şekli
PHP Kod:
cursor:crosshair

pointer
Ziyaretçiyi bir noktayı göstermeye güdüler.
Kullanım şekli
PHP Kod:
cursor:pointer

move
Ziyaretçiyi bir şeyi tutup hareket ettirmeye güdüler.
Kullanım şekli
PHP Kod:
cursor:move

e-resize
Herhangi bir nesneyi doğuya doğru genişletmek için kullanılır.
Kullanım şekli
PHP Kod:
cursor:e-resize

ne-resize
Herhangi bir nesneyi kuzey doğuya doğru genişletmek için kullanılır.
Kullanım şekli
PHP Kod:
cursor:ne-resize

nw-resize
Herhangi bir nesneyi kuzey batıya doğru genişletmek için kullanılır.
Kullanım şekli
PHP Kod:
cursor:nw-resize

n-resize
Herhangi bir nesneyi kuzeye doğru genişletmek için kullanılır.
Kullanım şekli
PHP Kod:
cursor:n-resize

se-resize
Herhangi bir nesneyi güney doğuya doğru genişletmek için kullanılır.
Kullanım şekli
PHP Kod:
cursor:se-resize

sw-resize
Herhangi bir nesneyi güney batıya doğru genişletmek için kullanılır.
Kullanım şekli
PHP Kod:
cursor:sw-resize

s-resize
Herhangi bir nesneyi güneye doğru genişletmek için kullanılır.
Kullanım şekli
PHP Kod:
cursor:s-resize

w-resize
Herhangi bir nesneyi batıya doğru genişletmek için kullanılır.
Kullanım şekli
PHP Kod:
cursor:w-resize

text
Ziyaretçiyi yazı yazmaya güdüler.
Kullanım şekli
PHP Kod:
cursor:text

wait
Ziyaretçiye "bekle" der.
Kullanım şekli
PHP Kod:
cursor:wait

help
Ziyaretçiyi yardım almak için tıklamasını güdüler.
Kullanım şekli
PHP Kod:
cursor:help

Bu imleçlerden birini kullanabilirsiniz ancak kendi belirlediğimiz bir imleci koymak daha uygun olur bunun için googledan mouse cursors diye aratıp bir imleç seçerek aşağıdaki kodu kullanmalıyız.
PHP Kod:
cursor:url('ornek.cur'); 

Şimdi gelelim bu kodu nasıl kullanacağımıza. Faremizin tüm sitede belirlediğimiz şekilde olması için öncelikle belirlediğimiz imleci Ftp aracılığı ile images klasörüne yolluyoruz.(cur formatında olmalı) Sonra aşağıdaki adımları uyguluyoruz:
Admin Paneli >> Temalar & Şablonlar >> Kullandığımız tema >> global.css >> Gelişmiş Düzenleme
Bul:
PHP Kod:
body 

Değiştir:(imlec.cur u kendi imlec adınızla değiştirin)
PHP Kod:
body {
    
cursorurl(images/imlec.cur); 
Yani burada body kümesine
PHP Kod:
cursorurl(images/imlec.cur); 
satırını eklemiş olduk.

Linklerin üzerine gelince görünmesini istediğiniz imleci eklemek için global.css de
Bul:
PHP Kod:
a:hovera:active 
Değiştir:(imlec.cur u kendi imlec adınızla değiştirin)
PHP Kod:
a:hovera:active {
    
cursorurl(images/imlec.cur); 

Evet şimdi sitemizde fare imleci değişmiş oldu.

Ancak fare imlecinin tüm sitede değilde sadece belirlediğiniz bir alanda olmasını istiyorsanız global.css nin en altında şu şekilde bir küme oluşturun:
PHP Kod:
mouse_cursor {
    
cursorurl(images/imlec.cur);


Sonrada belirdediğiniz alanları şu div tagları içerisine alın:
PHP Kod:
<div id="mouse_cursor">
 
kodlar buraya
</div

Bu sayede belirlemiş olduğumuz alan üzerine geldiğimizde mouse imlecimiz değişecektir.

Veya aynı mantığı kullanarak div içerisine alınmış bir alanın css kodlarına
PHP Kod:
cursorurl(images/imlec.cur); 
kodunu eklememiz yeterli olacaktır.

Hayırlı çalışmalar.

Yararlanılan kaynaklar:
Kod:
http://www.sanalkurs.net/css-ile-fare-imlecini-degistirmek-mouse-cursor-1565.html
Cevapla
Sponsor Reklam
sponsor reklam sponsor reklam

Çevrimdışı Trinstudedx
 Tarih: 06-06-2012, Saat:12:24
#2
Paylaşım için teşekkürler.
Cevapla
Bunu Beğenenler:

Çevrimdışı Ertanbnm
 Tarih: 18-09-2013, Saat:19:22
#3
Teşekkürler Süper
Cevapla
Bunu Beğenenler:

Çevrimdışı fghfgh
 Tarih: 13-01-2014, Saat:12:59
#4
:GülümsemeUykuKızgın - SinirliSüperAglamak
Cevapla
Bunu Beğenenler:

 


Konu ile Alakalı Benzer Konular
Konular Yazar Yorumlar Okunma Son Yorum
  Mybb Siyah Fare imleci Smyrna35 16 9,788 01-01-2015, Saat:11:27
Son Yorum: Kiliza
  [MCTR - 1.6] MyBB Grup Stili - Foruma Mouse İmleci Eklemek + Sorunsuz 007combatant 13 6,449 03-12-2013, Saat:16:50
Son Yorum: tekseferlik



Konuyu Okuyanlar: 1 Ziyaretçi