Twipsy tooltip with an unreachable link inside

[avirambm]

I'm trying to use Twipsy as a hovering tooltip with a link inside the tooltip.

The problem is that when the mouse cursor leaves the element then the tooltip disappears and users can't reach the link inside the tooltip (take a look at the Demo (http://twitter.github.com/bootstrap/javascript.html#twipsy) and see that you can't put your mouse cursor on the twipsy black bubble as it disappear).

Please advise.

[bbenezech]

delayOut

[avirambm]

That's not a solution but rather a bad hack, because if there is another twipsy element next to it then two tooltips may be visible at the same time, and one may cover the other.

[fat]

There isn't a way to do this. Our tooltips weren't designed to have interactive content.

If you did want this, your best bet would be to roll a custom solution which houses the tooltip within the element which is being hovered, so that the mouseout event isn't fired.

[avirambm]

Oh, too bad. Thanks for the answer Jacob.

[jescalan]

Although Jacob is most certainly correct that it's a better idea to roll your own in this instance, I posted a hacky way to solve this issue on stack overflow.

[fat]

Oh, actually in 2.0 you can do placement: "inside top" and it will insert the tipsy inside the element being hovered. You'll have to do some work with css from there to make sure it doesn't inherit styles, etc. Not sure if this will actually make it into the final 2.0 release.