without writing large codes.in this post i am
going to show that.to use this CollapsiblePanelExtender
you have to have ajaxcontroltoolkit installed.
this post will guide you-
http://www.asp.net/ajaxlibrary/act.ashx
the following codes shows how to do-
<asp:DataList ID="StudListDataList" DataKeyField="id"
runat="server" RepeatDirection="Horizontal" RepeatColumns="3">
<ItemTemplate>
<asp:Image id="StudImage" ImageUrl='<%# Eval("imageurl") %>'
Height="110" Width="110" runat="server" /><br />
<b><asp:Label CssClass="StudNameStyle" ID="StudName"
runat="server" Text='<%# Eval("studname") %>' /></b><br />
<asp:Label ID="BreedLabel" Text="Breed:" runat="server" />
<asp:Literal ID="BreedName" runat="server"
Text='<%# Eval("breedname") %>'/><br />
<asp:Label ID="StateLabel" Text="State:" runat="server" />
<asp:Literal ID="Literal1" runat="server"
Text='<%# Eval("state") %>'/><br />
<asp:Label ID="Label11" Text="Price:" runat="server" />
<asp:Literal ID="Literal10" runat="server"
Text='<%# Eval("price") %>'/><br />
<asp:LinkButton ID="textLabel" runat="server"
Text="Show Details" />
<asp:Panel ID="detailsPanel" CssClass="ModalWindow"
runat="server">
<asp:Label ID="Label4" CssClass="popuUpTextStyle"
Text="First Name:" runat="server" /><br />
<asp:Literal ID="Name" runat="server"
Text='<%# Eval("name") %>'/><br />
<asp:Label ID="Label6" CssClass="popuUpTextStyle"
Text="Address:" runat="server" /><br />
<asp:Literal ID="Literal2" runat="server"
Text='<%# Eval("address") %>'/><br />
<asp:Label ID="Label7" CssClass="popuUpTextStyle"
Text="City:" runat="server" /><br />
<asp:Literal ID="Literal3" runat="server"
Text='<%# Eval("city") %>'/><br />
<asp:Label ID="Label8" CssClass="popuUpTextStyle"
Text="Zip:" runat="server" /><br />
<asp:Literal ID="Literal4" runat="server"
Text='<%# Eval("zip") %>'/><br />
<asp:Label ID="Label9" CssClass="popuUpTextStyle"
Text="Phone:" runat="server" /><br />
<asp:Literal ID="Literal5" runat="server"
Text='<%# Eval("phone") %>'/><br />
<asp:Label ID="Label10" CssClass="popuUpTextStyle"
Text="Email:" runat="server" /><br />
<asp:Literal ID="Literal6" runat="server"
Text='<%# Eval("email") %>'/><br />
</asp:Panel>
<asp:CollapsiblePanelExtender ScrollContents="true"
ID="Collaps1" TargetControlID="detailsPanel"
CollapsedText="Show Details" ExpandControlID="textLabel"
CollapseControlID="textLabel"
SuppressPostBack="True" ExpandedText="Hide Details"
Collapsed="true" runat="server" ExpandedSize="70"
TextLabelID="textLabel">
by this above code when user clicks show Details
link of datalist item then the details will be
shown from the detailsPanel Panel.this Panel is set
as TargetControlID by the CollapsiblePanelExtender.

logging in