How to set/active bootstrap tooltip using javascript?

Question

I'm so frustrated that I cannot solve this simple question. How to programmingly set/active bootstrap tooltip?

For example, we are at page: http://getbootstrap.com/2.3.2/javascript.html#tooltips and let's open the chrome console and make tooltip work on the fly on the 'home' link in the left up corner.

var home = $($('.navbar li a')[0]);// select that home link
home.tooltip({title:'wthhhh'}); // set the default title
home.tooltip('show');

Step 3 doesn't bring up the tooltip.

Any help?

EDIT: I understand bootstrap has got a major update, but I believe it's irrelevant. Tooltip doesn't seem change.

Marlon Bernardes · Accepted Answer · 2013-07-31 03:49:38Z

4

By default bootstrap's tooltip is placed on top of the element, and since you're selecting the top nav bar, it's appearing off the screen - you can't really see it, but it's there.

If you change the tooltip placement from top (default) to bottom you will be able to see it correctly:

var home = $($('.navbar li a')[0]);
home.tooltip({title: 'wthhhh', placement: 'bottom'})
home.tooltip('show');

answered Jul 31, 2013 at 3:49

Marlon Bernardes

13.9k7 gold badges39 silver badges45 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to set/active bootstrap tooltip using javascript?

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related