当用户悬停在某些文本上时，如何打开一个小窗口？

Question

我正在准备一个可以显示更多数据的网页，而不会使页面变得非常麻烦。我正在考虑以不同的方式来做到这一点。一种方法是当用户悬停在文本的特定部分上时，将额外的数据奇迹般地显示在小窗口上。雅虎！当你将鼠标悬停在某个用户身上时，解决方案就是这样的。但我认为这一定是复杂的代码方式（对于我的水平）。

，所以我在寻找一个简单的方法来得到一个小的弹出窗口旁边的鼠标指针出现，当用户将鼠标悬停在一个特别有趣的文字。一旦用户离开文本，窗口应该自动消失。 关于这个话题，我有几个问题：

• 这怎么办？
• 能把它不使用JavaScript来实现？
• 我应该考虑什么其他解决办法？ （例如我看到一些网页展开了一些部分，当用户悬停点击它们时）

Answer 1

只需使用DIV显示您的文本，打开一个全新的窗口就是矫枉过正，因为大多数人在其浏览器中都有弹出式窗口拦截器，窗口甚至不会显示。 我建议使用JQuery（很好的开始，如果你是新的，因为它会让你的JavaScript开发比较容易的方式）和JQuery的工具提示插件发现here

Answer 2

雅这可以使用javascript来完成。

你必须写文本元素的鼠标悬停及移出事件。 创建一个应用了某些样式的div，并将元素内的文本显示为div的innerText。根据文本元素设置div的位置。

Answer 3

你也可以使用Yahoo!用户界面（YUI）库，它类似于jQuery。事实上，这很可能是他们在Yahoo!上使用的。答案网站。

看看他们非常有用的网站。 http://developer.yahoo.com/yui/container/overlay/

Answer 4

最漂亮解决方案可能会使用jQuery和jQuery的工具提示插件，如上所述。如果您真的热衷于避免使用JavaScript，只需使用css即可达到此目标：

<div id="bigdiv"> 
bla 
<div id="tooltip">this is a bla</div> 
</div> 

#tooltip{ 
    display:none; 
} 
#bigdiv:hover #tooltip{ 
    display:block; 
}