Jitesh Byahut 2/22/2014 2611

How To Use Accordion In JQuery

Here we are using JQuery accordion in Asp.Net

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title>JQuery-accordion</title>

    <script src="../../Scripts/Jquery-ui/js/jquery-1.9.1.js" type="text/javascript"></script>

    <script src="../../Scripts/Jquery-ui/js/jquery-ui-1.10.3.custom.js" type="text/javascript"></script>

    <link href="../../Scripts/Jquery-ui/css/ui-lightness/jquery-ui-1.10.3.custom.css" rel="stylesheet" />

    <script type="text/javascript">

        $(document).ready(function () {           

           $("#accordion").accordion();

        });

    </script>

</head>

<body>

    <form id="form1" runat="server">

      <div id="accordion" style="width:250px;">

            <h3>Asp.Net</h3>

            <div>This is Asp.Net page</div>

            <h3>C#</h3>

            <div>This is C# page</div>

            <h3>JQuery</h3>

            <div>This is JQuery page</div>

            <h3>Javascript</h3>

            <div>This is Javascript page</div>

            <h3>Sql Server</h3>

            <div>This is Sql Server page</div>

       </div>       

    </form>

</body>

</html>

View output :

demoimage


Please give your feedback for improving this page