光标描述文本框

时间:2012-06-15 10:03:21

标签: javascript css hover

当我将鼠标悬停在HTML对象上时,我搜索了很多并且找不到在光标旁边创建小文本框的方法。

Example http://guyzyl.org/wp/Picture1.png

您可以在此示例中看到光标不可见,但悬停在上方时会出现文本框。我想创造一些类似的东西。

示例取自Facebook。

感谢您的帮助

4 个答案:

答案 0 :(得分:3)

工具提示可以在标签上添加title属性,例如:

<a href="#" title="my tooltip">my link</a>
使用javascript可以获得看起来很漂亮的工具提示,但上面是正确的语义选项(许多工具提示插件都希望它能在你的代码中使用)

答案 1 :(得分:1)

使用此:

    <img title="my tooltip" src="" alt=""/>

答案 2 :(得分:0)

这叫做工具提示。像这样写:

<div class="parent">
 <p>create group</p>
 <div class="tooltip">tooltip</div>
</div>

CSS

.tooltip{
 display:none;
}
.parent:hover .tooltip{display:block;}

选中此http://jsfiddle.net/zDLzF/

答案 3 :(得分:0)

有许多花哨的工具提示可用。最简单的jQuery工具提示 - http://cssglobe.com/post/1695/easiest-tooltip-and-image-preview-using-jquery