jQuery工具提示不起作用

Question

I know there are tons of similar questions already in the SO on this same topic. I have been through them all. It seems I can't get this to work. Please let me know where I am going wrong! This is how my code looks-

$("a").tooltip({
     bodyHandler: function() { 
        return "Tool Tip is working!"; 
     },
     showURL: false 
});

Here is a fiddle, The tool tip does not to work. Please help.

http://jsfiddle.net/LE7V3/175/

Answer 1

I have updated the fiddle you provided http://jsfiddle.net/LE7V3/183/

 $( document ).tooltip(); 

 <link rel="stylesheet" href="//code.jquery.com/ui/1.11.3/themes/smoothness/jquery-ui.css"> <script src="//code.jquery.com/jquery-1.10.2.js"></script> <script src="//code.jquery.com/ui/1.11.3/jquery-ui.js"></script> <a href="#" title="tooltip">Display Tooltip</a> <div id= "tt-content" style="width:250px; display:none" > <p>HTML TO BE DISPLAYED IN THE TOOLTIP.</p> <p>EVEN MORE HTML</P> </div> 

here is the way tooltip works. you can use jquery on hover to set title of "a" tag instead of setting the tooltip itself . this will make the tooltip dynamic as u want .

hope this is helpfull

Answer 2

The tooltip plugin is not available. You have not included it. if you debug $("a").tooltip you will see that its undefined .

@Arun P Johny has provided a jsFiddle with the solution in the comments.

Here's the link to his jsFiddle