Question

我一直在寻找一种方法来实现悬停弹出而没有运气。因为它被用在很多网站上我觉得很容易找到说明书，但我想知道我是否遗漏了一些基本的东西。我看过qTips2和其他几个，但这些看起来比我需要的更多。

我有一个Rails 3.1应用程序，并希望在用户将鼠标悬停在表格中的某一行时显示更多详细信息。这是我遗漏的Rails内置的东西，还是我需要一个附加组件？

我肯定会感谢有人指着我正确的方向。

谢谢！

Answer 1

使用一些CSS和Javascript！

以下是您可以使用的示例：http://jsfiddle.net/cdpZg/

在此复制，以防万一。

HTML：

<div id='user'>I am a user. Move your mouse over me</div>
<div id='popup'>Extended info about a user</div>
<div>I a piece of useless information. No use hovering over me.</div>

CSS：

#popup {
    height: 50px;
    width: 200px;
    text-align: center;
    vertical-align:middle;
    background-color: cornflowerblue;
    color: white;
    display: none;
    padding-top: 8px;
    position: absolute;
}

使用Javascript：

$(document).ready(function() {
    $('#user').hover(function() {
        $('#popup').show();
    }, function() {
        $('#popup').hide();
    });
});

Answer 2

只需在此链接上设置标题

即可

<a title="Some text that will show up when I hover over this link">My link</a>

如何在Rails 3.1中创建鼠标悬停在弹出窗口上

2 个答案: