ubah kursor ke penunjuk jari

Saya punya ini adan saya tidak tahu bahwa saya perlu memasukkan ke dalam "onmouseover" sehingga kursor akan berubah menjadi penunjuk jari seperti tautan biasa:

<a class="menu_links" onclick="displayData(11,1,0,'A')" onmouseover=""> A </a>

Saya membaca suatu tempat yang harus saya letakkan:

onmouseover="cursor: hand (a pointing hand)"

Tapi itu tidak berhasil untukku.

Ditambah lagi, saya tidak yakin apakah ini dianggap JavaScript, CSS, atau hanya HTML biasa.

<a class="menu_links" onclick="displayData(11,1,0,'A')" onmouseover="" style="cursor: pointer;"> A </a>

Itu css.

Atau dalam style sheet:

a.menu_links { cursor: pointer; }

Anda dapat melakukan ini dalam CSS:

a.menu_links {
    cursor: pointer;
}

Ini sebenarnya adalah perilaku default untuk tautan. Anda harus entah bagaimana menimpanya entah di mana di CSS Anda, atau tidak ada hrefatribut di sana (itu hilang dari contoh Anda).

Saya suka menggunakan ini jika saya hanya memiliki satu tautan di halaman:

onMouseOver="this.style.cursor='pointer'"

di css tulis

a.menu_links:hover{ cursor:pointer}

Ini adalah sesuatu yang keren jika Anda ingin bekerja lebih keras dengan ini. di url, Anda dapat menggunakan tautan atau menyimpan png gambar dan menggunakan jalur. sebagai contoh:

url ('aset / imgs / theGoods.png');

di bawah ini adalah kode:

.cursor{
  cursor:url(http://www.icon100.com/up/3772/128/425-hand-pointer.png), auto;
}

Jadi ini hanya akan bekerja di bawah ukuran 128 X 128, lebih besar dan gambar tidak akan dimuat. Tapi secara praktis Anda bisa menggunakan gambar apa pun yang Anda inginkan! Ini akan mempertimbangkan css3 murni, dan beberapa html. yang harus Anda lakukan dalam html adalah

<div class='cursor'></div>

dan hanya di div itu, kursor itu akan ditampilkan. Jadi saya biasanya menambahkannya ke tag tubuh.

Saya pikir "jawaban terbaik" di atas, meskipun secara pemrograman akurat, sebenarnya tidak menjawab pertanyaan yang diajukan. pertanyaannya bertanya bagaimana cara mengubah pointer di acara mouseover. Saya melihat posting tentang bagaimana seseorang dapat memiliki kesalahan di suatu tempat tidak menjawab pertanyaan. Di jawaban yang diterima, acara mouseover kosong ( onmouseover="") dan opsi gaya, sebagai gantinya, disertakan. Bingung mengapa ini dilakukan.

Mungkin tidak ada yang salah dengan tautan penyelidik. pertimbangkan html berikut:

<a id=test_link onclick="alert('kinda neat);">Click ME!</a>

Ketika mouse pengguna melewati tautan ini, pointer tidak akan berubah menjadi tangan ... sebaliknya, pointer akan berperilaku seperti itu berada di atas teks normal. Orang mungkin tidak menginginkan ini ... jadi, penunjuk tetikus perlu diperintahkan untuk berubah.

jawaban yang dicari adalah ini (yang diposting oleh orang lain):

<a id=test_link onclick="alert('Nice!');"
       onmouseover="this.style.cursor='pointer';">Click ME!</a>

Namun, ini adalah ... mimpi buruk jika Anda memiliki banyak ini, atau menggunakan hal semacam ini di semua tempat dan memutuskan untuk membuat semacam perubahan atau mengalami bug. lebih baik membuat kelas CSS untuk itu:

a.lendhand {
  cursor: pointer;
}

kemudian:

<a class=lendhand onclick="alert('hand is lent!');">Click ME!</a>

ada banyak cara lain yang, bisa dibilang, lebih baik daripada metode ini. DIV s, BUTTON s, IMG s, dll mungkin terbukti lebih bermanfaat. Saya melihat tidak ada salahnya menggunakan <a>...</a>.

jarett.

Tambahkan hrefatribut untuk menjadikannya tautan yang valid & return false;di pengendali acara untuk mencegahnya menyebabkan navigasi;

<a href="#" class="menu_links" onclick="displayData(11,1,0,'A'); return false;" onmouseover=""> A </a>

(Atau membuat displayData()return false dan ..="return displayData(..)

Solusi melalui CSS murni sebagaimana disebutkan dalam jawaban yang ditandai sebagai yang terbaik tidak cocok untuk situasi ini.

Contoh dalam topik ini tidak memiliki atribut href statis normal, hanya memanggil JS, jadi ia tidak akan melakukan apa pun tanpa JS.

Jadi, baik untuk mengaktifkan pointer dengan JS saja. Jadi solusinya

onMouseOver="this.style.cursor='pointer'"

seperti yang disebutkan di atas (tapi saya tidak bisa berkomentar di sana) adalah yang terbaik dalam hal ini. (Tapi ya, pada umumnya, untuk tautan normal yang tidak menuntut JS, lebih baik bekerja dengan CSS murni tanpa JS.)