Can anyone explain how to develop a search box and filter box similar to how's new search box is styled? See the attachment to see an example of what I'm referring to. Basically in front of the search text box is a small filter option to search only within certain categories. If you click on the default option (All), an actual HTML select box appears just below the search box with all of your available options.

By looking at the HTML code, I'm assuming this works by creating a div/span with the default searching option displayed in plain text. An HTML select box is also included but hidden by default. When you hover or click the div/span, the select box is displayed. When an option is selected in the select box, the div/span text is changed to the selected value and the select box is hidden again. Is that the idea?

What would you call this? I've been searching Google to find samples of this and haven't found any similar examples of this. I don't really know what I should be searching for?

Attachment: amazon-search.png