Oii XTibianos, ontem não tive tempo de postar um tutorial, então hoje eu vou postar um mini tutorial. O tutorial é bem simples, então chega de falar e vamos...
Nós podemos alterar o cursor do mouse do visitante de um site quando ele fica sobre uma determinada palavra, utilizando a propriedade cursor.
No exemplo abaixo, nós vamos aplicar essa propriedade na tag <abbr>:
O <abbr title="browser da Mozilla">Firefox</abbr> é um browser. A empresa <abbr>Google<abbr> tem crescido muito.
Se você quiser que a descrição apareça quando o cursor ficar em cima da palavra, basta inserir o "title" em sua linha de código.
A empresa <abbr title="Uma empresa">Google<abbr> tem crescido muito.
Esse é o CSS para a tag <abbr>, adicionamos também a propriedade border-bottom para destacar a palavra:
abbr {cursor:help; border-bottom:dashed 1px #008cff;}
Com isto, você vai conseguir fazer com que apareça a descrição de seu item e que o cursor do ponteiro mude.
Existem outros tipos de ponteiro, basta adicionar o respectivo valor na propriedade cursor, veja:
cursor:help; -> Um ponto de exclamação "?" junto como o cursor.cursor:wait; -> Uma apulheta no lugar do cursor.
cursor:progress; -> Uma apulheta junto com o cursor.
cursor:crosshair; -> Uma cruz no lugar do cursor.
cursor:move; -> Ponteiro que indica que algo pode se mover.
cursor:pointer; -> A clássica "mãozinha" no lugar do cursor.
cursor:n-resize; -> Cursor de duas pontas na vertical.
cursor:e-resize; -> Cursor de duas pontas na horizontal.
cursor:sw-resize; -> Cursor de duas pontas inclinado para a direita.
cursor:nw-resize; -> Cursor de duas pontas inclinado para a esquerda.
Fonte:
Clique aqui
Espero que gostem :smile_positivo:
Abraços.