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
in my next post i'll explain aboutSlider using BootStrap in ASP.Net
Leave Comment