如何使jquery自动完成不覆盖其下的其他内容？

目前，我有一个文本框，在它的一些文字...我不想建议来隐藏我的基础文本..我该怎么办呢？如何使jquery自动完成不覆盖其下的其他内容？

编辑：

显然，似乎问题并没有告诉我想要的东西，所以这里有云：

我希望下面的<div>到一点点下移，随便怎么样谷歌搜索与做工作“上的即时” ......他们移动的结果向下放置的建议。

编辑：

什么@thirtydot下面回答[接受的答案]工作还算不错，
但我做了一些改变jQuery的UI的类为我临时做的工作。我曾在jQuery的CSS文件中删除从ui-autocomplete类position: absolute;。这工作太...

来源

2011-03-02 Shrinath

应该怎样，而不是发生？ – thirtydot 2011-03-02 12:53:23

您确定要将自动填充建议列表透明化（或在后台）吗？这将是一个烂摊子，为用户阅读列表的内容... – Albireo 2011-03-02 12:57:48

@thirtydot，@kappa：看到谷歌搜索与_instant ON_如何做 – Shrinath 2011-03-02 12:58:33

Live Demo

我加入这个CSS：

#results { 
    position: relative 
}

，改变你的JavaScript是这样的：

$("#tags").autocomplete({ 
    source: availableTags, 
    open: function(event, ui) { 
     $('#results').css('top', $('.ui-autocomplete').height() + 8); 
    }, 
    close: function(event, ui) { 
     $('#results').css('top', 0); 
    } 
});

来源

2011-03-02 13:33:29 thirtydot

Niiccceeeeee ..... Accepted !!! – Shrinath 2011-03-03 06:14:12

你可以做

.ui-widget-content { 
    background-color:transparent; 
}

来源

2011-03-02 12:54:39 chris

都能跟得上......不是透明的。请参见谷歌是如何在谷歌即时 – Shrinath 2011-03-02 12:58:51

显示在绝对定位div的，建议列表。查看代码并搜索CSS样式。

的解决方案是将DIV添加到下面的文本字段的页面的HTML代码，并移除任何position: CSS样式。由于它是空的，它不占用任何空间。当添加内容时，它会根据需要增长。

来源

2011-03-02 13:11:24

做我不明白...你能请_jsfiddle_它吗？你可以使用我在问题中发布的版本并修改它并在这里发回链接？ – Shrinath 2011-03-02 13:27:50

这可能需要一些调整，但它似乎工作。

$("#tags").autocomplete({ 
    source: availableTags 
}); 

$("#results").insertAfter(".ui-autocomplete");

来源

2011-03-02 14:21:14 chris

如何使jquery自动完成不覆盖其下的其他内容？

回答

相关问题