Jquery tooltip widget

Good day.
I decided to publish the post that brought the invite.
Recently finished working on a widget for the JS jQuery library. Of course at the moment there are analogues, and even some are given here. But in all implementations there are certain drawbacks and shortcomings, unfortunately, this implementation also did not avoid some problems, but it seems that its advantages far outweigh all the shortcomings. Maybe someone will like it, and someone decides to fix, finish or improve the implementation, then you are welcome.

So, let's begin.
From the beginning, the link to the page for downloading the source code: download .
And also, immediately, a page with examples and a demonstration of the work and examples of source code: an example
What do we need for the work of a tooltip? We need the JQuery 1.3 library itself for this (you can get the latest version here ), Position plugin can be read more from this wiki page , Template plugin allows you to set a template string, and based on JSON parameters, substitution of which in the template yields the completed string.

Installation

Installing a tooltip is as easy as any other jquery widget. All you need to do is to connect the jquery.jtooltip.js file with a java script, as well as a file with jquery.jtooltip.css styles.
< script type ="text/javascript" src ="jqueryJS/jquery-1.3.2.min.js" ></ script >
<script type= "text/javascript" src= "jqueryJS/jquery-ui-1.7.2.custom.min.js" ></script>
<script type= "text/javascript" src= "jqueryJS/jquery.bgiframe.js" ></script>
<script type= "text/javascript" src= "jqueryJS/jquery.template-0.3.js" ></script>
<script type= "text/javascript" src= "jqueryJS/jquery.ui.position.js" ></script>
<script type= "text/javascript" src= "jqueryJS/jquery.jtooltip.js" > </ script >
< link type ="text/css" rel ="stylesheet" href ="jqueryCSS/jquery-ui-1.7.2.custom.css" />
< link type ="text/css" rel ="stylesheet" href ="jqueryCSS/jquery.jtooltip.css" />

* This source code was highlighted with Source Code Highlighter .

< script type ="text/javascript" src ="jqueryJS/jquery-1.3.2.min.js" ></ script >
<script type= "text/javascript" src= "jqueryJS/jquery-ui-1.7.2.custom.min.js" ></script>
<script type= "text/javascript" src= "jqueryJS/jquery.bgiframe.js" ></script>
<script type= "text/javascript" src= "jqueryJS/jquery.template-0.3.js" ></script>
<script type= "text/javascript" src= "jqueryJS/jquery.ui.position.js" ></script>
<script type= "text/javascript" src= "jqueryJS/jquery.jtooltip.js" > </ script >
< link type ="text/css" rel ="stylesheet" href ="jqueryCSS/jquery-ui-1.7.2.custom.css" />
< link type ="text/css" rel ="stylesheet" href ="jqueryCSS/jquery.jtooltip.css" />

* This source code was highlighted with Source Code Highlighter .

To create a tooltip on some elements / elements, you need to execute just a line of code.

$( '#set1 *' ). jtooltip();

* This source code was highlighted with Source Code Highlighter .

At the same time, the text for the default tip is taken from the element's title attribute, after which this attribute is removed to avoid displaying the standard browser hint.

Options:

All parameters are displayed as follows: Parameter name: default value

• delay: 200
  The prompt is displayed after some short delay indicated in the value. Set the value of this parameter to 0 when you want to remove the delay.
  
• fade: false
  By default, a tooltip appears without any effects; setting this parameter to any number will allow the tooltip to appear smoothly. For more information, visit the fadein effect page.
  
• tooltipClass: "ui-widget-content ui-corner-all"
  Do you want to customize or change the standard type of tooltip, change this parameter, add any classes, and design the tooltip, as it will be more convenient for you.
  
• template: "{Title}"
  The template string receives JSON parameters and forms the output string based on the rules specified in this line. For more information and examples, see the template plugin.
  If you change the default value of this parameter, then please set one of the loadURL parameters or describe the getJSONparams callback function so that the widget can get JSON parameters
  
• loadURL: ""
  url to download JSON data from the server. If you describe the getJSONparams callback function, jTooltip calls this function to get the client parameters to send them to the server.
  
• Position prompts:
  Specify the hint offset relative to the item above which it is displayed.
  top: 10 // y offset
  left: 15 // x-axis offset
  position_at: 'right bottom', // this is an at parameter in position plugin
  position_my: 'left center', // this is my parameter in position plugin
  For all possible options for parameter values, see position plugin .
  
• id: "tooltip"
  When you create a tooltip, after this element the widget adds a div element (all added div elements have the class " ui-tooltip ") and also gives it an id consisting of the id element and this id parameter. Note that when the element does not contain the id value of the parameter, the widget creates a unique call to the getMilliseconds () function of the current date.
  

')

Methods:

Show - programmatically displays a hint.

$(selector).jtooltip( "show" );

* This source code was highlighted with Source Code Highlighter .

Hide - programmatically hides an open hint.

$(selector).jtooltip( "hide" );

* This source code was highlighted with Source Code Highlighter .

Developments:

Onshow - triggered when the hint is displayed.

jtt.bind( 'onshow' , function () {
//print code here for action on tooltip showing
} );

* This source code was highlighted with Source Code Highlighter .

Onhide - triggered when the hint is hidden

jtt.bind( 'onhide' , function () {
//print code here for action on tooltip showing
} );

* This source code was highlighted with Source Code Highlighter .

Many code examples are presented on the sample page .
A more detailed description of the tooltip is provided on this page .
If you have questions, ask.
PS very welcome any comments, corrections, or even indications of errors, flaws, development assistance.
PPS Unfortunately, there was not enough karma to publish to the jQuery blog.