Olá pessoal, venho trazendo uma coisinha para vocês. É um efeito que se chama ToolTip, ele substitui o indicar de detalhes do Windows (ou qualquer outro sistema) por um personalizado, mas vale lembrar que só funciona no seu blog e não no sistema operacional. Veja como fica dentro do blog, antes e depois.
1. Clique na guia Modelo e clique no botão Editar HTML.
2. Faça uma cópia de segurança do seu template, clicando em: Baixar modelo completo.
3. Pressione as tlecas Ctrl+F e procure por:
</head>
4. Imediatamente acima dela, cole este código:
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/><script language='JavaScript' src='http://categoriabloggeruplod.webs.com/JavaScript/qTip.js' type='text/JavaScript'/>
5. Logo depois, procure por esta tag:
]]></b:skin>
6. E cole acima dela este código:
div#qTip {padding: 3px;border: 1px solid #666; ---/* edite cor da borda */border-right-width: 2px;border-bottom-width: 2px;display: none;background: #999; ---/* edite cor de fundo */color: #FFF; ---/* edite cor do texto */font: bold 9px Verdana, Arial, sans-serif;text-align: left;position: absolute;z-index: 1000;}
Este código é responsável pela personalização do hack. Para fazer as edições terá que ter um código hexadecimal para prosseguir.
7. Depois de customizado, clique em Visualizar, para conferir se estar tudo correto e logo após, clique em Salvar modelo.
8. Para o efeito ocorrer é preciso usar este código:
<a href='ENDEREÇO-DO-LINK' title='DESCRIÇÃO-DO-TITULO' target='_blank'>NOME-DO-LINK</a>
Substitua o que se pede e pronto! Até a próxima!
1 Comentário
Gostei desse efeito, bastante profissional e dinâmico, acrescenta mais valor à estrutura de um blog.
17 de janeiro de 2014 às 13:00Postar um comentário