AJAX Accordion

Ranjeet_8
Posted by Ranjeet_8 under ASP.NET AJAX category on | Points: 40 | Views : 1249

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>
<%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="ajaxToolkit" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Untitled Page</title>
<style rel="stylesheet" type="text/css">
body
{
font-family: Verdana;
font-size: small;
}
.Link
{
text-decoration: underline;
color: Blue;
}

.AH
{
border: 1px solid #2F4F4F;
color: white;
background-color: #2E4d7B;
padding: 5px;
margin-top: 5px;
cursor: pointer;
}

.AHS
{
border: 1px solid #2F4F4F;
color: white;
background-color: #5078B3;
padding: 5px;
margin-top: 5px;
cursor: pointer;
}

.AC
{
background-color: #D3DEEF;
border: 1px dashed;
border-top: none;
padding: 5px;
}


</style>

</head>
<body>
<form id="form1" runat="server">
<div>

<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>

<ajaxToolkit:Accordion ID="Accordion1"
runat="server"
HeaderCssClass="AH"
HeaderSelectedCssClass="AHS"
ContentCssClass="AC">

<Panes>
<ajaxToolkit:AccordionPane ID="p1" runat="server">
<Header>F1 Header</Header>
<Content>
First Row<br />
Sample Text Here... Sample Text Here...<br /> Sample Text Here... Sample Text Here...<br />
Sample Text Here... Sample Text Here... <br />Sample Text Here... Sample Text Here...<br />
</Content>
</ajaxToolkit:AccordionPane>

<ajaxToolkit:AccordionPane ID="p2" runat="server">
<Header>F2 Header</Header>
<Content>
Second Row<br />
Sample Text Here... Sample Text Here...<br /> Sample Text Here... Sample Text Here...<br />
Sample Text Here... Sample Text Here... <br />Sample Text Here... Sample Text Here...<br />
</Content>
</ajaxToolkit:AccordionPane>

<ajaxToolkit:AccordionPane ID="p3" runat="server">
<Header>F3 Header</Header>
<Content>
Third Row<br />
Sample Text Here... Sample Text Here...<br /> Sample Text Here... Sample Text Here...<br />
Sample Text Here... Sample Text Here... <br />Sample Text Here... Sample Text Here...<br />
</Content>
</ajaxToolkit:AccordionPane>
</Panes>
</ajaxToolkit:Accordion>
</div>
</form>
</body>
</html>


Comments or Responses

Login to post response