blog

Home / DeveloperSection / Blogs / Horizontal Menu using JQuery in ASP.Net

Horizontal Menu using JQuery in ASP.Net

Anonymous User10764 15-Jan-2014

In this blog, I’m explaining how to make horizontal menu using jquery in ASP.Net

Example  :-

In This Example we Create horizontal menu Using jquery

Form Design:- 

 

<%@PageLanguage="C#"AutoEventWireup="true"CodeFile="HorizontalMenu.aspx.cs"Inherits="HorizontalMenu"%>
<!DOCTYPEhtml>
<htmlxmlns="http://www.w3.org/1999/xhtml">
<headrunat="server">
    <title></title>
    <scriptsrc="JS/jquery.js"></script>
    <scriptsrc="JS/menu.js"></script>
    <linkhref="CSS/menu.css"rel="stylesheet"/>
</head>
<body>
    <formid="form1"runat="server">
        <divid="menu">
            <ulclass="menu">
                <li><ahref="#"><span>Home</span></a>
                    <div>
                        <ul>
                            <li><ahref="#"><span>Sub Item 1</span></a></li>
                            <li><ahref="#"><span>Sub Item 2</span></a></li>
                            <li><ahref="#"><span>Sub Item 3</span></a></li>
                        </ul>
                    </div>
                </li>
                <li><ahref="#"><span>Product Info</span></a>
                    <div>
                        <ul>
                            <li><ahref="#"><span>Sub Item 1</span></a></li>
                            <li><ahref="#"><span>Sub Item 2</span></a></li>
                            <li><ahref="#"><span>Sub Item 3</span></a></li>
                            <li><ahref="#"><span>Sub Item 4</span></a></li>
                        </ul>
                    </div>
                </li>
                <li><ahref="#"><span>Help</span></a>
                    <div>
                        <ul>
                            <li><ahref="#"><span>Sub Item 1</span></a></li>
                            <li><ahref="#"><span>Sub Item 2</span></a></li>
                            <li><ahref="#"><span>Sub Item 3</span></a></li>
                        </ul>
                    </div>
                </li>
                <li><ahref="#"><span>Contacts</span></a>
                   <div>
                        <ul>
                            <li><ahref="#"><span>Sub Item 1</span></a></li>
                            <li><ahref="#"><span>Sub Item 2</span></a></li>
                            <li><ahref="#"><span>Sub Item 3</span></a></li>
                        </ul>
                    </div>
                </li>
            </ul>
        </div>
        <divid="copyright"><ahref="http://apycom.com/"></a></div>
    </form>
</body>
</html>

Use this jquery File :- 

 

<scriptsrc="JS/jquery.js"></script>
<scriptsrc="JS/menu.js"></script>
<linkhref="CSS/menu.css"rel="stylesheet"/>

Download and add the above three files into your projects because it’s

mandatory for using the jquery libraries . 

OutPut 

 Horizontal Menu using JQuery in ASP.Net

 in my next post i'll explain aboutSlider using BootStrap in ASP.Net


Updated 18-Sep-2014
I am a content writter !

Leave Comment

Comments

Liked By