Create Horizontal Menu using Bootstrap in ASP.Net

Hi

I have created a sample which full fill your requriement you need to modify it according to your need

HTML

<div>
    <div id="menu">
        <ul class="nav navbar-nav navbar-left">
            <li class="active">
                <asp:LinkButton ID="lnkAllProducts" CssClass="btn btn-block" Text="All Products"
                    runat="server" OnClick="BindImages" />
            </li>
            <li>
                <asp:LinkButton ID="lnkBestSellers" CssClass="btn btn-block" Text="Best Sellers"
                    runat="server" />
            </li>
            <li>
                <asp:LinkButton ID="lnkNewestAdded" CssClass="btn btn-block" Text="Newest Added"
                    runat="server" />
            </li>
        </ul>
    </div>
    <br />
    <br />
    <br />
    <div>
        <asp:Repeater ID="rptImages" runat="server">
            <HeaderTemplate>
                <table>
            </HeaderTemplate>
            <ItemTemplate>
                <tr>
                    <td>
                        <asp:Image ID="imgProducts" ImageUrl='<%# string.Format("~/images/Product/{0}",Eval("ImageName")) %>'
                            runat="server" />
                    </td>
                </tr>
            </ItemTemplate>
            <FooterTemplate>
                </table>
            </FooterTemplate>
        </asp:Repeater>
    </div>
    <div>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
        <script type="text/javascript" src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
        <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" />
        <script type="text/javascript">
            $(function () {
                $('#menu ul li a').click(function () {
                    var selectedLink = $(this)[0].innerHTML
                    localStorage.setItem('selectedLink', selectedLink);
                });
            });
            window.onload = function () {
                $('#menu ul li a').each(function () {
                    if ($(this)[0].innerHTML == localStorage.getItem('selectedLink')) {
                        $(this).attr('style', 'background-color:deeppink');
                        localStorage.removeItem('selectedLink');
                    }
                    else {
                        $(this).attr('style', 'background-color:none');
                    }
                });
            }
        </script>
    </div>
</div>

C#

protected void BindImages(object sender, EventArgs e)
{
    //You need to Bind below datatable from database.
    DataTable dt = new DataTable();
    dt.Columns.Add("ImageName");
    dt.Rows.Add("Chrysanthemum.jpg");
    dt.Rows.Add("Koala.jpg");
    dt.Rows.Add("Tulips.jpg");
    dt.Rows.Add("Jellyfish.jpg");
    dt.Rows.Add("Desert.jpg");
    dt.Rows.Add("Hydrangeas.jpg");
    dt.Rows.Add("Lighthouse.jpg");

    rptImages.DataSource = dt;
    rptImages.DataBind();
}

VB.Net

Protected Sub BindImages(sender As Object, e As EventArgs)
	'You need to Bind below datatable from database.
	Dim dt As New DataTable()
	dt.Columns.Add("ImageName")
	dt.Rows.Add("Chrysanthemum.jpg")
	dt.Rows.Add("Koala.jpg")
	dt.Rows.Add("Tulips.jpg")
	dt.Rows.Add("Jellyfish.jpg")
	dt.Rows.Add("Desert.jpg")
	dt.Rows.Add("Hydrangeas.jpg")
	dt.Rows.Add("Lighthouse.jpg")

	rptImages.DataSource = dt
	rptImages.DataBind()
End Sub

ScreenShot