输入框选项下拉列表

Question

我正在考虑创建这样的东西：

http://konigi.com/interface/kontain-search

alt text http://s3.amazonaws.com/konigi/interface/kontain-search-2.png

我不认为任何人有任何资源可以指导我吗？我知道我没有提供太多信息，但我不知道从哪里开始寻找。

干杯！

编辑抱歉，我的意思是下拉/输入框，该网站上没有其他内容。

再次编辑下拉列表是输入框中的 ，因此我想知道为什么。

Answer 1

它可能与这些示例类似，但只有一个主要项目。并用jquery操纵每个“li”并采取行动

example 1 | example 2 | example 3 | example 4

版本答案：这是用css完成的。 全部包含在div中 - ＆gt;输入+菜单。 对于输入被删除边框样式和背景颜色与容器div相同。

Answer 2

好吧，您将搜索表单的一部分放在隐藏的div中，并在用户点击或悬停在表单内部或外部的其他元素时将其弹出。根据需要使用CSS来定位div。不太确定你可能会遇到类似的问题。

也许你可以更具体一点，并在几个更集中的问题中解决这个问题？

Answer 3

我没有深入到网站，但从逻辑的角度来看，也许搜索框和下拉列表是“内部”另一个元素（div？），形成复杂的控件......并且只是格式化（CSS）/动作（jQuery）放在那些。

<div id="searchDiv">
    <div id="searchText"></div>
    <div id="searchDropdown"></div>
    <div id="searchButton"><div>
</div>

很容易设置这样的东西。

Answer 4

我认为那里发生的事情并不是下拉列表在输入框内，而是输入框镶嵌颜色被隐藏，并且它被放置在一个看起来像输入的div中以及下拉列表。