jQuery UI Accordion
Here we are using jQuery ui accordion.
<html>
<head>
<title>jQuery UI 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"/>
<scripttype="text/javascript">
$(document).ready(function() {
$("#accordion").accordion();
});
</script>
</head>
<body>
<divid="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>
</body>
</html>
View output :
