Search Areas

Had a task where a user didn't want to use the primary "search by" of searching in a list which is usually to search by "name" or "number". I did some research and found a way to keep the majority users satisfied, yet still giving the ability to the advanced user. Check it out...

Regular search box:


Search box with search areas:


It's actually not to tricky to do. It's just a table with two cells. The left cell is the input box with a style of no boarders and right cell is a div with a pic in it. When you click the div with the pic in it another div below is shown with absolute positioning. I will let you figure out the javascript and css. It's not too hard.

iStockPhotography currently has something similar.