Bootstrap tooltip not working

Question

My JavaScript:

<script> $(function(){ $('a[rel=tooltip]').tooltip(); }); ​</script> 

And my HTML:

 <br><br><br>This is an example of a sentence with a <a href="#" rel="tooltip" title="This is the tooltip!">tooltip</a>! 

This does not show the Bootstrap 2.0 tooltip, but it does show some default values.

Answer 1

Try adding code to the footer. it worked for me! for some reason it doesn't work in the header!

Answer 2

Say you announced your tooltips as follows:

 <a href="#" rel="tooltip" class="tip" title="Rating:' + rating + '">'+ name +'</a> 

In the same file, make sure you include:

 <script type="text/javascript"> $('.tip').tooltip(); </script> 

Note that you must either reference this code after the HTML it refers, or wrap it in

 <script type="text/javascript"> $(document).ready(function() { $('.tip').tooltip(); }); </script> 

Also note that the jQuery selector refers to a tooltip class, not just the identifier for a single tooltip.

Answer 3

Make sure you have all the css styles for the .tooltip class.

Without them, a tooltip may appear outside the visible part of your browser window.