How To Make Cool Css ToolTips Title Link

How To Make Cool Css ToolTips Title Link

very easy to do it and you just follow step by step and added jQuery and some CSS, Box Shadow to make good shadow and you must added 2 code bellow to your templates or sites :

Css

div#qTip {
padding: 3px;
display: none;
background: #00c0ff;
color: #ffffff;
font: bold 9px Verdana, Arial, sans-serif;
position: absolute;             
z-index: 1000;
-moz-box-shadow: 2px 2px 2px #afafaf;         /* You Can Change Shadow Background */
-webkit-box-shadow: 2px 2px 2px #afafaf;
box-shadow: 2px 2px 2px #afafaf;
}

jQuery Files

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'></script>
<script language='JavaScript' src='http://buymythemes-lab.googlecode.com/files/qTip.js' type='text/JavaScript'></script>

See Images

before you added two code on top you must find this code with ctrl-f to open searh box and copy code bellow to box search :

]]></b:skin>

after you found it you must added css on top that code and jQuery on bellow that code if you not understand, you can see images.

Note

This tips work for blogger, wordpress, jombla and all type websites.

Demo Finish

Just Click link on sites and waiting 2 second and cool ToolTips will show,

Live Demo