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:-
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="HorizontalMenu.aspx.cs" Inherits="HorizontalMenu" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="JS/jquery.js"></script>
<script src="JS/menu.js"></script>
<link href="CSS/menu.css" rel="stylesheet" />
</head>
<body>
<form id="form1" runat="server">
<div id="menu">
<ul class="menu">
<li><a href="#"><span>Home</span></a>
<div>
<ul>
<li><a href="#"><span>Sub Item 1</span></a></li>
<li><a href="#"><span>Sub Item 2</span></a></li>
<li><a href="#"><span>Sub Item 3</span></a></li>
</ul>
</div>
</li>
<li><a href="#"><span>Product Info</span></a>
<div>
<ul>
<li><a href="#"><span>Sub Item 1</span></a></li>
<li><a href="#"><span>Sub Item 2</span></a></li>
<li><a href="#"><span>Sub Item 3</span></a></li>
<li><a href="#"><span>Sub Item 4</span></a></li>
</ul>
</div>
</li>
<li><a href="#"><span>Help</span></a>
<div>
<ul>
<li><a href="#"><span>Sub Item 1</span></a></li>
<li><a href="#"><span>Sub Item 2</span></a></li>
<li><a href="#"><span>Sub Item 3</span></a></li>
</ul>
</div>
</li>
<li><a href="#"><span>Contacts</span></a>
<div>
<ul>
<li><a href="#"><span>Sub Item 1</span></a></li>
<li><a href="#"><span>Sub Item 2</span></a></li>
<li><a href="#"><span>Sub Item 3</span></a></li>
</ul>
</div>
</li>
</ul>
</div>
<div id="copyright"><a href="http://apycom.com/"></a></div>
</form>
</body>
</html>
Use this jquery File :-
<script src="JS/jquery.js"></script>
<script src="JS/menu.js"></script>
<link href="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 about Slider using BootStrap in ASP.Net
Leave a Comment