Tambahkan hover teks tanpa javascript seperti kita mengarahkan pada reputasi pengguna


262

Dalam stackoverflow, ketika kita mengarahkan pada reputasi pengguna kita melihat sebuah teks. Saya telah melihat ini di banyak tempat dan kode sumber memberitahu saya bahwa itu dapat dilakukan tanpa js. Dan saya mencoba dan hanya mendapatkan ini-

 <div="text">hover me</div>

Jawaban:


495

Gunakan titleatribut, misalnya:

<div title="them's hoverin' words">hover me</div>

atau:

<span title="them's hoverin' words">hover me</span>


3
apakah sama seperti ketika kita mengarahkan pada reputasi pengguna
Ash

1
Ya, jika Anda melihat kode sumber untuk reputasi, Anda akan melihat bahwa atribut title diatur ke reputation score.
gcochard

6
@Kevin Solusi ini sebenarnya lebih baik daripada solusi JavaScript karena ini akan bekerja pada browser dengan JavaScript dinonaktifkan, dan juga menambahkan petunjuk kepada pembaca layar tentang isi elemen.
gcochard

1
@KevinMeredith Saya akan mengatakan bahwa satu-satunya ukuran dimana solusi JS akan lebih baik adalah bahwa Anda tidak dapat mendesain teks yang muncul dan dibiarkan dengan implementasi asli saja.
zero298

1
@David d C e Freitas: terima kasih telah mencerahkan StackOverflow dengan hasil edit Anda untuk jawaban ini ... tidak tahu bagaimana sebenarnya menandai Anda tetapi oh well
Meredith

16

Atribut judul juga berfungsi dengan baik dengan elemen html lainnya, misalnya tautan ...

<a title="hover text" ng-href="{{getUrl()}}"> download link
</a>

15

Seringkali saya meraih tag html singkatan dalam situasi ini.

<abbr title="Hover">Text</abbr>

https://www.w3schools.com/tags/tag_abbr.asp


7
Elemen itu secara khusus dimaksudkan untuk digunakan untuk menunjukkan singkatan, jadi ini bukan ide yang baik. Anda memberi tahu sistem text-to-speech untuk mengucapkannya sebagai singkatan. Gunakan <span>jika Anda hanya ingin membawa teks.
Lars Marius Garshol

Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.