CODEWITHSUNDEEP
jquerytooltip
user1139403
user1139403

Reputation: 81

Tooltip code not working

I have created a div with the ID 'tt-content', I want the div and all the html contained within it to appear as a tooltip when I hover over the link. I have used jquery bodyhandler but my code is still not working. I have only reecently started coding, so I don't know whether it is a problem with my syntax or if code is completely wrong. Thank you in advance.

<html>
<head>

<script type="text/javascript"     src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" >

$(document).ready(function(){
   $("a").hover(function () {

        $("a").tooltip({
         bodyHandler: function() { 
        return $("#tt-content").html(); 
    },
    showURL: false 
        });
    });
});
</script>


</head>

<body>
<a href="#">Display Tooltip</a>


<div  id= "tt-content" style="width:250px" >

<p>HTML TO BE DISPLAYED IN THE TOOLTIP.</p>
<p>EVEN MORE HTML</P>


</div>


</body>



</html>

Upvotes: 2

Views: 5827

Answers (3)

swapnesh
swapnesh

Reputation: 26722

Include these JS before your script tag, if you are not missing any particular plugin JS files.

Check for the demo of jquery tooltip -- http://docs.jquery.com/Plugins/Tooltip/tooltip#options

<script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/tooltip/jquery.dimensions.js"></script>
<script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/tooltip/jquery.tooltip.js"></script>

Upvotes: 1

Mariusz Jamro
Mariusz Jamro

Reputation: 31633

You're using a jQuery's pluging and forgot to include it's javascript and css files:

<script type="text/javascript" src="http://jquery.bassistance.de/tooltip/jquery.tooltip.js"></script>
<link rel="stylesheet" href="http://jquery.bassistance.de/tooltip/jquery.tooltip.css" />
<!-- You would probably need to copy those files to your server. -->

Upvotes: 1

Liam
Liam

Reputation: 29624

The JQuery function tooltip isn't part of the core jquery library, it's part of the dimensions library, http://docs.jquery.com/Plugins/Tooltip, so you need to add a reference to this. That said the Drupal site on the the Jquery page appears to be down....

Upvotes: 1

Related Questions