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>