Vertical accordion
This is how to make vertical accordion.
|
1 2 3 4 5 6 7 8 9 10 11 12 |
$(function(){ $('#vAcc dt').next().hide(); $('#vAcc dt').click(function(){ $(this).next().toggleClass('open'); if($(this).next().hasClass('open')===true){ $(this).next().fadeIn('ease'); } else if($(this).next().hasClass('open')===false){ $(this).next().fadeOut('ease'); } }); }); |
|
1 2 3 4 5 6 7 8 |
<dl id="vAcc"> <dt>ttl01</dt> <dd>testtesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttest</dd> <dt>ttl02</dt> <dd>testtesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttest</dd> <dt>ttl03</dt> <dd>testtesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttest</dd> </dl> |
|
1 2 3 4 5 6 7 8 9 10 11 |
dt,dd{ height: 45px; float: left; } dt{ background: #666; } dd{ width: 500px; height: 45px; } |
comment
go to related tags archive?
No tags setted.
SEARCH ARTICLES
in this site
TAG CLUSTER
LATEST COMMENT
in this site
No comment yet.