I'm playing around with Twitter Bootstrap's Tooltips, but am having problems since they moved away from Twipsy. The correect JavaScript is included in the page.
Let's say I have the following:
<p><a href="#" rel="tooltip" data-original-title="hello">hover on me</a></p>
What is the exact JavaScript I need to use to make the tooltip appear?
Thanks in advance!
You need to explicitly run .tooltip()
for all elements that have to have tooltip. For example, this will work:
<span rel="tooltip" title="tooltip text">some text</span>
...
<script src="/js/jquery.js"></script>
<script src="/js/bootstrap.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("[rel=tooltip]").tooltip();
});
</script>
For your example it will just be:
$('a').tooltip();
but according to the documentation, you should use the title
attribute, not data-original-title
. That attribute is added by Bootstrap's tooltip code. Also there is no need for rel="tooltip"
.
Your code should be:
HTML:
<a href="#" title="hello">hover on me</a>
JS:
$("a").tooltip(); // this will trigger a tooltip on all <a> elements
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With