0

我正在研究一个工具提示(在输入时显示其中的内容)。它在 chrome 上运行良好,但只是在我在 Mozilla Firefox 上测试它之前。工具提示位于 Chrome 浏览器中文本区域框的底部(这是我想要的),但在 Mozilla Firefox 中,它显示在某个随机位置,但所有文本区域的工具提示显示在同一随机位置聚焦文本区域。我知道这是一个 CSS 问题,但仍附上所有相关代码。

CSS

.tooltip
{
    color:#0D776e;
    font-size:15px;
    font-family:calibri;
    min-height:25px;
    border-radius:4px;
    margin:0 0.5%;
    word-wrap:break-word;
    display:none;
    z-index:500;
    width:200px;
    position:absolute;
    top:32px;
}

jQuery

$(document).ready(function()
{
    $("textarea").focus(function()
    {
        var targetArea = $(this);
        targetArea.siblings('div').fadeIn(400).css({"background-color":"#E7F1F0","border":"1px solid #86BBB6"}).html(targetArea.val());
    });

    $("textarea").blur(function()
    {
        var targetArea = $(this);
        targetArea.siblings('div').fadeOut(400).css({"background-color":"#E7F1F0","border":"1px solid #86BBB6"});
    });

    $("textarea").keyup(function()
    {
        var targetArea = $(this);
        targetArea.siblings('div').html(targetArea.val());
    });
});
4

1 回答 1

1

如果我从之前的帖子中记得你在TD. TD将不接受位置,因此将所有内容包装在DIVwith中,position:relative以便工具提示可以从DIV

于 2013-01-12T18:02:37.140 回答