Question

I’m trying to use Twitter’s Bootstrap css and js modules. Specifically, the twipsy module, which displays a little text message when you hover over a link

there’s a demo http://twitter.github.com/bootstrap/javascript.html#twipsy

blah blha <a href="#" rel="twipsy" data-original-title="Some title text">you probably</a> blah blah   #should display "some title text" when you hover over 'you probably'

I copied some of the html from the demo and included twipsy.js in this jsfiddle.net

http://jsfiddle.net/mjmitche/quH9Q/

but when I hover over the link, the text isn’t popping up.

Answer 1

1. Include jQuery to use twispy. All Bootstrap JavaScript plugin need jQuery or Ender to work.

2. Activate twispy for selected elements by calling .twipsy(). Example you copied from the bootstrap page uses $("a[rel=twipsy") .

3. By default the popover is placed above the text. It won’t be visible if your text is on top of the page (as in the fiddle). You can configure placement option or move the text down.

HERE is the code.

HTML:

blah blha <a href="#" rel="twipsy" data-original-title="Some title text">you probably</a> blah blah

JS:

$("a[rel=twipsy]").twipsy({ placement: "below" });