Oi meninas ♥ Tudo bom?
Galerinha, trago um tutorial muito útil para colocar no seu blog. É um efeito ao qual quando você passar o mouse em cima de uma imagem irá aparecer uma frase, exemplo: Eu passo o mouse em cima dessa imagem acima aí aparece : "Tutorial: Mensagem ao passar o mouse", mas também, funciona em outros locais. (Créditos : Cherry Bomb)
GO?
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js'type='text/javascript'/><script language='JavaScript' src='http://yourjavascript.com/1411249631/qTip.js'
type='text/JavaScript'/>
Depois disso, procure por ]]></b:skin>, acima disso cole:
div#qTip {padding: 3px; /*Espaço entre a borda e o texto*/border: 1px solid #666; /* Estilo da borda */display: none; /*Não mexa*/background: #999; /* Cor de fundo */color: #fff; /*Cor da fonte*/font-family: Verdana; /*Tipo de fonte*/font-size: 9px; /*Tamanho da fonte*/position: absolute; /*Não mexa*/z-index: 1000; /*Não mexa*/}type='text/JavaScript'/>
Bom, se vocês não gostarem dessas cores que a Liah sugeriu (a Liah do CB) é só ir mudando até a cor que deseja.
Então.. ainda não acabou. Para que o tooltip apareça, quando colocar um link em algo, utilize:
<a href="link" title="Descrição do link">Texto linkado</a>
Onde está Descrição do link você irá postar o que vai quer no tooltip. Ah, antes que termine, também serve para imagens, é só colocar esse código:
<a href="link" title="Descrição da imagem"><img src="link-da-imagem/></a>
Duvidas? Deixe aí nos comentários que irei tentar tira-las.
Créditos: Cherry Bomb
Nenhum comentário:
Postar um comentário