开发者

Making a visual smooth flowing search bar, ASP.NET C#

开发者 https://www.devze.com 2022-12-28 19:43 出处:网络
I am trying to make a search bar with a few feilds. Right now the code is as follows: <asp:DropDownList ID=\"DropDownList1\" runat=\"server\" Height=\"25px\">

I am trying to make a search bar with a few feilds. Right now the code is as follows:

        <asp:DropDownList ID="DropDownList1" runat="server" Height="25px">
            <asp:ListItem>Database</asp:ListItem>
            <asp:ListItem>Engine</asp:ListItem>
            <asp:ListItem>Pool</asp:ListItem>
        </asp:DropDownList>
        <asp:Button ID="Button1" runat="server" Text="Button"开发者_Go百科 Height="25px" />
        <asp:TextBox ID="TextBox1" runat="server" Height="25px"></asp:TextBox>
        <asp:LinkButton ID="LinkButton1" runat="server">LinkButton</asp:LinkButton>

Right now it looks like crap and doesnt flow at all, I was wondering how I would go about making a better visual looking search bar with all the required feilds. Thanks.

Example: digg.com has images in there search bar.

EDIT: Basically I want to code this image: http://o.imm.io/qlQ.png


The biggest lesson I've learned is if you have a small amount of space and some options the user has to choose (and understand) don't use standard HTML controls. Design a real solution opposed to using the annoying HTML elements.

One main issues in building the search area is that the dropdownlist is not very style-able. Try building in the options that they can choose. You only have three options to pick from a radiobutton list would work better as the user would see all the options. You can then apply a filter onto the list and make it an image based toggle option list.

see the first example here for other options (Interface elements on demand) : http://www.smashingmagazine.com/2009/01/12/10-useful-web-application-interface-techniques/

Making a visual smooth flowing search bar, ASP.NET C#


(source: smashingmagazine.com)

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号