Slide en Acordeon – Javascript

Código JavaScript

<script type=»text/javascript»>
$(function(){
$(«.link»).click(function(e) {
e.preventDefault();
$(‘div.panel:visible’).hide();
$(this).next(‘div.panel’).show();
});
});
</script>

Código CSS

<style>
.adiv{
padding:10px;
text-align:center;
background-color:#5BA0C9;
color:white;
border:solid 1px #C9E0ED;
font-weight:bold;
}
.panel{
padding:10px;
background-color:#EFF4FA;
border:solid 1px #C9E0ED;
display:none;
color:black;
font-weight:inherit;
}

.panel.active{
display:block;
}
.running{
display:block;
}
</style>

Código HTML

<div class=»adiv link» id=»div1″>Click to fade 1 boxes</div>
<div id=»#div1″ class=»panel active»>a</div><br/>
<div class=»adiv link» id=»div2″>Click to fade 2 boxes</div>
<div id=»#div1″ class=»panel»>b</div><br/>
<div class=»adiv link» id=»div3″>Click to fade 3 boxes</div>
<div id=»#div1″ class=»panel»>c</div><br/>[/code]