寻找类似stackoverflow的鼠标悬停功能 [英] Looking for a mouseover feature like stackoverflow

问题描述

我喜欢StackOverflow的悬停效果.

I love the hover effects of StackOverflow.

我想在我的Web应用程序中使用类似的功能.有人可以让我知道吗?这个功能叫做什么?是否有任何可用的库?我曾经使用过 jQuery工具提示，但是那一个并没有给我留下深刻的印象.

I want to use similar feature in my web-application. Can somebody let me know about it? What this feature is called? Is there any library available for this? I've used jQuery Tooltip but I was not impressed with that one.

当前，我在相当老的应用程序中使用 overLib .

Currently I'm using overLib in my application which is pretty old.

编辑:在这里听起来印象不佳，我只想具有像stackoverflow这样的鼠标悬停效果.

Impressed doesn't sound good here, I just want to have mouseover effect like stackoverflow.

推荐答案

我知道这很旧，但是我一直在寻找相同的东西，并且...以防万一有人想要实际上的东西看起来就像StackOverflow的标签工具提示...(为什么不呢?它们真的很棒)

I know this is old, but I was looking for the same thing, and... In case anyone wants something that actually looks like StackOverflow's tag tooltips... (and why wouldn't you? they're totally awesome)

演示: http://jsbin.com/korehubi/10

代码: http://jsbin.com/korehubi/10/edit

通过StackOverflow的代码精心复制.

Painstakingly reproduced by going through StackOverflow's code.

用法:

<div class="firstElement">The thing to hover over.</div>
<div class="coolTip" id="firstElement">This is the tooltip content.</div>

• 将"coolTip"类分配给工具提示div.
• 还为其分配一个ID，该ID与要悬停的元素上设置的类匹配.
• 在页面加载时运行coolTips().
• Assign the "coolTip" class to the tooltip div.
• Also assign it an ID that matches a class set on the element you want to hover over.
• Run coolTips() on page load.

请注意，上面示例中的tooltip div的内容仅用于演示用法.您需要使用jsbin链接中所示的HTML标记作为工具提示内容，以便具有StackOverflow风格的格式的工具提示.您还需要那里显示的所有CSS.

Note the contents of the tooltip div in the example above is just to demonstrate usage. You need to use HTML tags for the tooltip content as shown in the jsbin link, in order to have StackOverflow-esque formatted tooltips. You'll also need all the CSS shown there.

享受:)

更新:现在检查工具提示是否会从窗口边框中泄漏出来，并在这种情况下从右侧或底部进行动画处理.

Update: Now checks if the tooltip would leak out of the window border, and animates from the right or bottom instead in those cases.

这篇关于寻找类似stackoverflow的鼠标悬停功能的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！