Today, i am representing my own build jquery tooltip, it is very easy to use and build on very simple logic so that you can further modify its code. use it in your project for free, if you like it or have any suggestions / comments , or you have some idea to make it better, or you need some more features in it then pls just drop a comment in the same post.

Version 3.0 : Now use separate div tag to store tooltip data on same page.

DEMO : Using separate div tag.

How to use

1) include jquery, and tooltip.jquery.js files in your web page.

2) Javascript

$(document).ready(function(){
 $('.tooltip').tooltip();
 });

Avilable Options with default values

To use multiple option you need to seprate every option from ",".

<a id="tooltip_from_div" href="javascript;" class="tooltip">Tooltip With Hidden Div Tag</a>

<div id="data_tooltip_from_div" style="display:none;">this is developed by hidden div.</div>

Finish

Version 1.1 : Now no need to use static file to devlope tooltip.

DEMO : Without using static file.















How to use

1) include jquery, and tooltip.jquery.js files in your web page.

2) Javascript

$(document).ready(function(){
 $('.tooltip').tooltip();
 });

Avilable Options with default values

To use multiple option you need to seprate every option from ",".

<a id="This tooltip is developed by using this html tags id attribute" href="javascript;" class="tooltip">Tooltip without static file</a>

Finish

DEMO : Using static file

1) include jquery, and tooltip.jquery.js files in your web page.

2) Javascript

$(document).ready(function(){
 $('.tooltip').tooltip({
 folderurl : 'contents/'
 });
 });

Avilable Options with default values

To use multiple option you need to seprate every option from ",".

<a id="tooltip_1" href="javascript;" class="tooltip">Testing no 1 </a>

4) Tooltip Contents

now you need to write content which will be shown mouse hover on above link, the plugin search the file which is mentioned in "id" attribute of link (currently 'tooltip_1') in the specified folder location (javascript: 'folderurl'), by default the file extention is txt, so the file name will become like this contents/tooltip_1.txt



If you like my plugin, or have any suggestion, or need some more features pls drop a comment on my blog. Thx

Leave a comment