[My Blog] | [Code Projects Home] | [skmMenu] | [RssFeed]

Expandable Descriptions - Client-Side

This demo illustrates how to use templates and a bit of client-side DHTML to provide expandable descriptions. Click on the title of a blog entry to view the description... (Complete source code available at the bottom...)

 

Scott on Writing

July's Toolbox Column Now Online


6/30/2009

Final Six ASP.NET Hosting Tutorials Now Online


6/19/2009

Installing the FTP Service for IIS 6.0 On An Alternate Port Number and Configuring Windows Firewall


6/17/2009

June's Toolbox Column Now Online


5/28/2009

Sending ELMAH Errors Via GMail


5/21/2009

Next Four Hosting Tutorials Now Online


4/27/2009

May's Toolbox Column Now Online


4/24/2009

New Tutorials Series on Hosting


4/10/2009

April's Toolbox Column Now Online


3/21/2009

Happy Pi Day


3/14/2009

Computer Science Is All About Tradeoffs


3/13/2009

Daylight Savings and ASP.NET Fun Fact


3/8/2009

Leo Tolstoy for Developers


3/4/2009

What Johannes Kepler Can Teach Us About Debugging


3/1/2009

March's Toolbox Column Now Online


2/26/2009

[View Other RssFeed Demos] | [Return to the RssFeed Homepage]


HTML Portion
<script language="javascript">
<!--
   function showHide(panelID)
   {
      var panel = document.getElementById(panelID);
      if (panel != null)
      {
         if (panel.style.visibility == "hidden")
         {
            panel.style.display = "block";
            panel.style.visibility = "visible";
         } else {
            panel.style.display = "none";
            panel.style.visibility = "hidden";               
         }
      }
   }
// -->
</script>

<skm:RssFeed Width="67%" HorizontalAlign="Center" id="RssFeed1" runat="server" Font-Name="Arial">
   <HeaderStyle Font-Size="X-Large" ForeColor="White" BackColor="#400040" HorizontalAlign="Right"></HeaderStyle>
   <ItemTemplate>
      <h2 onclick="javascript:showHide('panel<%# Container.ItemIndex %>');"><%# Container.DataItem.Title %></h2>
      <br />
      <div id="panel<%# Container.ItemIndex %>" style="visibility: hidden; display: none;">
         <%# Container.DataItem.Description %>
      </div>
      <span style="font-size:small;font-style:italic;">
         <%# Container.DataItem.PubDate.ToShortDateString() %>
      </span>
   </ItemTemplate>
</skm:RssFeed>
Code-Behind Portion
private void Page_Load(object sender, EventArgs e)
{
	RssFeed1.DataSource = "http://scottonwriting.net/sowblog/Rss.aspx";
	RssFeed1.DataBind();
}