Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Olá Pessoal
Desenvolvi esse plugin para mostrar uma ToolTip de forma simples. Apesar de ter vários desenvolvidos pela internet, não encontrei nenhum de forma simples, eficiênte e que me agradasse, então resolvi desenvolver.
Estou publicando para possam utilizar e modificar.
DOWNLOAD do código completo com exemplo
Forma de utilizar:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>gaToolTip</title>
<style type="text/css">
body { font-family:Arial; font-size:12px; }
#gaTool { background-color:#EFEFEF; border:1px solid #F00; color:#000; }
.gaTool { color:#F00; font-weight:bold; }
</style>
<script type=text/javascript src="http://code.jquery.com/jquery-1.6.min.js"></script>
<script type=text/javascript src="query.gatooltip-1.0.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".gaTool").gaToolTip();
});
</script>
</head>
<body>
<h1>gaToolTip - Passe o mouse sobre as palavras em vermelho</h1>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo <span class="gaTool" title="Demostração ToolTip">ligula</span> eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis <span class="gaTool" title="?">parturient montes</span>, nascetur ridiculus mus.</p>
</body>
</html>Qualquer sugestão ou bugs que encontrarem, se possível me informem.
Para mais conteúdo, acesse meu blog http://mateusgamba.wordpress.com
Carregando comentários...