In this article, we learn how to create simple dropdown button in asp.net website.
In this demo I have used twitter bootstrap UI framework to create dropdown button. So first create Blank Asp.Net Website and add Default.aspx page.
First download below complete source code project and copy js, img and css folder from the project and paste to your project.
Now add reference of jQuery and CSS as follow to above <head> section of the default.aspx page.
Now add following code to Default.aspx page -
Demo
Download Complete Source Code
In this demo I have used twitter bootstrap UI framework to create dropdown button. So first create Blank Asp.Net Website and add Default.aspx page.
First download below complete source code project and copy js, img and css folder from the project and paste to your project.
Now add reference of jQuery and CSS as follow to above <head> section of the default.aspx page.
<head runat="server">
<title>Simple DropDown Button Demo</title>
<script src="js/jquery-1.8.2.min.js" type="text/javascript"></script>
<script src="js/bootstrap.min.js" type="text/javascript"></script>
<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" />
</head>
Now add following code to Default.aspx page -
<div class="dropdown">
<asp:LinkButton ID="LinkButton1" CssClass="dropdown-toggle" role="button" PostBackUrl="#" data-toggle="dropdown" data-target="#" runat="server">User Profile<b class="caret"></b></asp:LinkButton> <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
<li><a href="#">Profile</a></li>
<li><a href="#">Change Password</a></li>
<li><a href="#">Account Settings</a></li>
<li><a href="#">Log Out</a></li>
</ul>
</div>
Demo
Download Complete Source Code
0 comments:
Post a Comment