ReadMore / Read less hyperlinks using Jquery

Previously showed how to use ReadMore / ReadLess in GridView Now, here i will show how to create readmore and readless using jquery plugin (Expander)

ASPX page looks as shown below....

<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true"
    CodeBehind="Expander.aspx.cs" Inherits="ReadMoreReadLess_GridView.Expander" %>
 
<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
    <script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
    <script src="Scripts/jquery.expander.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () { $('div.expander').expander(); });
    </script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <h2>
        ReadMore / ReadLess using Jquery Plugin (Expander)</h2>
    <br />
    <div class="expander" style='width: 450px;'>
        <p>
            Paragraph 1: Lorem ipsum dolor sit amet, consectetur adipisicing elit, 

            sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 

            Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut 

            aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in 

            voluptate velit esse cillum dolore eu fugiat nulla pariatur.</p>
    </div>
    <div class="expander" style='width: 450px;'>
        <p>
            Paragraph 2: Excepteur sint occaecat cupidatat non proident, sunt in 

            culpa qui officia deserunt mollit anim id est laborum.
        </p>
    </div>
</asp:Content>

More Details, Demo & Plugin from HERE