The following two textboxes are set up in the $(document).ready{...} handler. It's the most normal use case of Bubble hints:
Some inputs need help text associated and we put them in the bubbles hints to show the help text on demand (and not clutter the UI).
 
The following is an example of setting up a bubble hint "late". Instead of using $document).ready{...}
we specifically use the onfocus and onblur events handlers on the textbox.
<input type="text" id="Text1" onfocus="$(this).ShowHint({text : 'Late bound hint'});" onblur="$(this).HideHint();"//>
Next is an example of using bubbles hints on select tags.
The following are examples on how to use the bubble hints with checkboxes and readiobuttons.
Now while the two first were based on focus and blur events, these are based on mouseover and mouseout events.
This way the user can see the help information without triggering a choice.
A
B
C
A
B
C
This example shows that bubble hints can be associated with non-input style elements as well.
Hover this div...
The following example is a bit more advanced. In this case the help text changes while the user is entering data into the input element.
The example shows how to set up the initial text and how to change it while the user is typing.
While all the previous examples are set up with static text, this example uses a callback to set the initial text.
The same pattern can be used to get the text dynamically from a server, and thereby delaying the transfer of help text.
    $("#sometextarea").AddHint({/
        onshow: function(element) {
            return "Write a description of your issue below in 200 characters."
        }
    });
        
... and hereafter...
   $("#sometextarea").keydown(
        function() {
            var element = $("#sometextarea");
            if ($(element)[0].value.length > 10) {
                var thetext = "Write a description of your issue below. You have used " + $(element)[0].value.length + " of 200 characters.";
                element.ShowHint({ text: thetext });
            }
        }
     );}
    );
(Try typing more than 10 characters...)

Much similar to the example above, the following shows another example of how to let the help text change according to the input from the users.
Write password here