Hey! Hey! Como vão todos? Os tutorial de hoje é direcionado para o cursor do blog. Faz muito, muito tempo que não trago algo desse tipo. Vou mostrar como personalizar o cursor com uma imagem ou ícone, porém com efeito hover. Ou seja ao passar o mouse sobre algum link a imagem vai mudar. Existe uma outra forma de hover também, utilizando modelos padrões de cursores: mãozinha, estrela, cursor com ampulheta, cruz e outros... Mas isso é para outro tutorial.
Passe o mouse na imagem para ver o efeito.
Esse tutorial já é meio antigo, porém quase não se vê tutorial dele por ai. Talvez por ser um detalhe quase imperceptível, mas ainda assim soma muito ao layout. No link acima você pode ver o exemplo desse tutorial, ok? Então vamos lá!
Códigos
<style>HTML,BODY, form, input {cursor: url("URL_CURSOR_NORMAL"), auto;}</style> <style>A:hover{cursor: url("URL_CURSOR_NO_LINK"), auto;}</style>
Nas partes indicadas adicione o URL da imagem e salve! Agora é só ver o resultado.Segundo Modo:
Wendy, pode ensinar como colocou a página do "Mapa" em uma página estática? Tipo, com um layout próprio?
ResponderExcluirBeijos! :)
Oie!! Claro posso sim, mas vai levar um tempinho. Pois a postagem ficará um cadinho extensa e preciso resumir de um modo que fique fácil de compreender. =3 Mas farei sim.
Excluir