让twipsy.js正常工作(来自twitter bootstrap)

Question

我正在尝试使用Twitter的Bootstrap css和js模块。具体地说，twipsy模块，当您将鼠标悬停在链接上时，它会显示一条小文本消息

有一个演示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'

我从演示中复制了一些html，并在此jsfiddle.net中包含了twipsy.js

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

但当我将鼠标悬停在链接上时，文本不会弹出。

Answer 1

1. 包含使用twispy的jQuery。所有Bootstrap JavaScript插件都需要jQuery或Ender才能工作。
2. 通过调用.twipsy()激活所选元素的twispy。从bootstrap页面复制的示例使用$("a[rel=twipsy")。
3. 默认情况下，弹出窗口位于文本上方。如果您的文本位于页面顶部(如小提琴中)，它将不可见。您可以配置placement选项或将文本下移。

是代码。

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" });